网页加载方法和装置制造方法及图纸

本发明专利技术提供一种网页加载方法和装置。其中，该方法包括：获取待加载网页的设计分辨率和网页内容，网页内容中包含至少两种元素；获取电子设备的显示分辨率与设计分比率的比值；根据比值确定网页内容中各元素的布局和/或网页的显示尺寸。本发明专利技术提供的网页加载方法和装置，根据电子设备显示分辨率和网页设计分辨率的比值，确定网页内容中各元素的布局和/或网页的显示尺寸，从而在开发和维护时只针对一个版本的网页，降低了网页开发和维护的成本。

【技术实现步骤摘要】

本专利技术涉及互联网技术，尤其涉及一种网页加载方法和装置。
技术介绍
在目前互联网技术高速发展的时代背景下，手机、电脑、手表和电视等多种电子设备都可以浏览网页。由于不同的电子设备的显示屏物理尺寸不同、浏览器内核及版本不同，导致不同的电子设备需要根据不同的浏览器窗口宽度、屏幕分辨率来浏览网页。因此，网页设计者需要针对不同电子设备开发其对应的网页格式，网页格式包括网页尺寸和网页布局。现有技术中，万维网联盟(WorldWideWebConsortium，简称：W3C)在层叠样式表(CascadingStyleSheet，简称：CSS3)标准中引入了MediaQuery语法，通过MediaQuery检测浏览器各个电子设备的分辨率。当电子设备接收到加载网页的请求后，根据电子设备的分辨率，选择该分辨率的电子设备对应的网页格式进行加载，从而实现电子设备显示符合其分辨率的网页。采用现有技术，需要对同一个网页设计不同分辨率情况下的网页格式，代码累赘并影响网页加载速度，在维护时需要同时调整多个版本的网页，从而导致网页开发和维护的成本较高。
技术实现思路
本专利技术提供一种网页加载方法和装置，降低了网页开发和维护的成本。本专利技术提供一种网页加载方法，包括：获取待加载网页的设计分辨率和网页内容，所述网页内容中包含至少两种元素；获取电子设备的显示分辨率与所述设计分比率的比值；根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸。在本专利技术一实施例中，若所述比值在第一预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：根据所述比值，对所述网页内容中的各元素的布局进行调整，以使所述各元素从以M列显示调整为以N列显示，所述M大于所述N，且为整数，所述N为大于等于1的整数。在本专利技术一实施例中，若所述比值在第二预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：根据所述比值，对所述网页的设计尺寸进行等比例缩放，得到所述网页的显示尺寸。在本专利技术一实施例中，若所述比值在第三预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：以所述设计分辨率在所述电子设备的显示区域内居中显示所述网页内容。在本专利技术一实施例中，所述第一预设区间为所述比值大于0小于0.5的区间；所述第二预设区间为所述比值大于0.5小于1.5的区间；所述第三预设区间为所述比值大于1.5的区间。在本专利技术上述实施例中，所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：根据所述待加载网页的属性和所述各元素的属性，确定所述各元素的排列位置和缩放比例。在本专利技术一实施例中，所述待加载网页的属性包括：换行方式和/或对齐方式；所述各元素的属性包括：排列顺序、放大占比、缩小占比和/或初始尺寸。本专利技术提供一种网页加载装置，包括：获取模块，用于获取待加载网页的设计分辨率和网页内容，所述网页内容中包含至少两种元素；所述获取模块还用于获取电子设备的显示分辨率与所述设计分比率的比值；处理模块，用于根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸。在本专利技术一实施例中，若所述比值在第一预设区间内；所述处理模块还用于，根据所述比值，对所述网页内容中的各元素的布局进行调整，以使所述各元素从以M列显示调整为以N列显示，所述M大于所述N，且为整数，所述N为大于等于1的整数。在本专利技术一实施例中，所述处理模块还用于根据所述待加载网页的属性和所述各元素的属性，确定所述各元素的排列位置和缩放比例。本专利技术提供一种网页加载方法和装置。其中，该方法包括：获取待加载网页的设计分辨率和网页内容，网页内容中包含至少两种元素；获取电子设备的显示分辨率与设计分比率的比值；根据比值确定网页内容中各元素的布局和/或网页的显示尺寸。本专利技术提供的网页加载方法和装置，根据电子设备显示分辨率和网页设计分辨率的比值，确定网页内容中各元素的布局和/或网页的显示尺寸，从而在开发和维护时只针对一个版本的网页，降低了网页开发和维护的成本。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。图1为本专利技术网页加载方法实施例一的流程示意图；图2为本专利技术对网页内容中各元素布局进行调整的实施例的示意图；图3为本专利技术网页加载方法实施例二的流程示意图；图4为本专利技术确定各元素的排列位置和缩放比例的实施例的示意图；图5为本专利技术网页加载装置实施例的结构示意图。具体实施方式下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。本专利技术的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本专利技术的实施例例如能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。下面以具体地实施例对本专利技术的技术方案进行详细说明。下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例不再赘述。图1为本专利技术网页加载方法实施例一的流程示意图。如图1所示，本实施例的执行主体为电子设备中能够访问网页的浏览器，电子设备包括能够安装浏览器程序的手机、电脑、手表和电视等。本实施例网页加载方法包括如下步骤：S101：获取待加载网页的设计分辨率和网页内容，网页内容中包含至少两种元素。其中，浏览器获取待加载网页的网页内容，网页内容中包含至少两种元素，元素可以是文本框、图片和/或视频浏览器等。S102：获取电子设备的显示分辨率与设计分比率的比值。其中，浏览器获取当前电子设备的显示分辨率，并计算显示分辨率与S101中获取的设计分辨率的比值。计算比值的方式可以是显示分辨率/设计分辨率，或设计分辨率/显示分辨率，在此不做限定。S103：根据比值，确定网页内容中各元素的布局和/或网页的显示尺寸。本步骤中，根据S102得到的比值，确定网页内容中各元素的布局和/或网页的显示尺寸，从而使得网页中的各元素能够适应当前的电子设备进行显示。浏览器通过S103中确定的各元素的布局和/或网页的显示尺寸显示网页，对更新后的网页进行渲染和绘制并显示在电子设备的显示区域内。本实施例提供一种网页加载方法和装置。其中，该方法包括：获取待加载网页的设计分辨率和网页内容，网页内容中包含至少两种元素；获取电子设备的显示分辨率与设计分比率的本文档来自技高网...

【技术保护点】
一种网页加载方法，其特征在于，包括：获取待加载网页的设计分辨率和网页内容，所述网页内容中包含至少两种元素；获取电子设备的显示分辨率与所述设计分比率的比值；根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸。

【技术特征摘要】
1.一种网页加载方法，其特征在于，包括：获取待加载网页的设计分辨率和网页内容，所述网页内容中包含至少两种元素；获取电子设备的显示分辨率与所述设计分比率的比值；根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸。2.根据权利要求1所述的方法，其特征在于，若所述比值在第一预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：根据所述比值，对所述网页内容中的各元素的布局进行调整，以使所述各元素从以M列显示调整为以N列显示，所述M大于所述N，且为整数，所述N为大于等于1的整数。3.根据权利要求2所述的方法，其特征在于，若所述比值在第二预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：根据所述比值，对所述网页的设计尺寸进行等比例缩放，得到所述网页的显示尺寸。4.根据权利要求3所述的方法，其特征在于，若所述比值在第三预设区间内；所述根据所述比值，确定所述网页内容中各元素的布局和/或所述网页的显示尺寸，包括：以所述设计分辨率在所述电子设备的显示区域内居中显示所述网页内容。5.根据权利要求4所述的方法，其特征在于，所述第一预设区间为所述比值大于0小于0.5的区间；所述第二预设区间为所述比值大于0...

【专利技术属性】
技术研发人员：双锴，贾倩楠，徐鹏，王玉龙，程祥，张忠宝，苏森，
申请(专利权)人：北京邮电大学，
类型：发明
国别省市：北京;11