网页页面加载的方法及装置与流程

文档序号:12465318阅读:182来源:国知局
网页页面加载的方法及装置与流程

本发明涉及计算机软件领域,具体涉及一种网页页面加载的方法及装置。



背景技术:

网页页面一般包括了父页面和框架页面,框架页面中可以根据用户需求进行内容的更换,方便网页页面内容的及时更新。当框架页面中显示比较多的内容时,可以通过拖动网页页面上的页面滚动条上下滚动,查看相关的内容。但由于拖动页面滚动条无法做到精确地定位到需要的位置。为方便用户的查看,可采用在框架页面中设置一个或多个锚点。在用户点击相应的锚点时,框架页面可以直接精准的定位到锚点标记的位置,快捷方便。

在使用锚点的过程中,有时会发生锚点失效的问题。即在用户点击锚点后,锚点无法生效,框架页面不能定位到锚点标记的位置,使得用户体验效果不佳。究其原因在于,框架页面中的所有元素均被显示在父页面中,即对于框架页面而言,其已经全部显示,因此锚点在点击后,不会再移动页面进行定位。因此,需要对父页面和框架页面进行相应的设置,在网页页面加载后,可以正常的使用锚点。



技术实现要素:

鉴于上述问题,提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的网页页面加载的方法及装置。

根据本发明的一个方面,提供了一种网页页面加载的方法,其包括:

接收服务端返回的待加载的网页页面,网页页面包含父页面和框架页面;

解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息;父页面高度的配置信息记载了父页面高度为浏览器窗口高度;框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度;

根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值;

根据所确定的父页面高度值和框架页面高度值,加载网页页面。

根据本发明的另一方面,提供了一种网页页面加载的装置,其包括:

接收模块,适于接收服务端返回的待加载的网页页面,网页页面包含父页面和框架页面;

解析模块,适于解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息;父页面高度的配置信息记载了父页面高度为浏览器窗口高度;框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度;

高度确定模块,适于根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值;

加载模块,适于根据所确定的父页面高度值和框架页面高度值,加载网页页面。

根据本发明提供的网页页面加载的方法及装置,接收服务端返回的待加载的网页页面,网页页面包含父页面和框架页面。解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。父页面高度的配置信息记载了父页面高度为浏览器窗口高度,框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。根据所确定的父页面高度值和框架页面高度值,加载网页页面。其中,通过设置父页面高度和框架页面高度,使父页面高度为浏览器窗口高度,并根据预设规则设置框架页面的高度,将框架页面的高度设置为大于或等于父页面高度。在解析确定父页面高度值和框架页面高度值后,加载网页页面。进而使得父页面不能完全的将框架页面的元素显示在浏览器中,这样就使得在加载中框架页面中若存在锚点,锚点可用,解决了锚点失效的问题。

上述说明仅是本发明技术方案的概述,为了能够更清楚了解本发明的技术手段,而可依照说明书的内容予以实施,并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂,以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本发明的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:

图1示出了根据本发明一个实施例的网页页面加载的方法的流程图;

图2示出了根据本发明另一个实施例的网页页面加载的方法的流程图;

图3示出了根据本发明一个实施例的网页页面加载的装置的功能框图;

图4示出了根据本发明另一个实施例的网页页面加载的装置的功能框图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例,然而应当理解,可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反,提供这些实施例是为了能够更透彻地理解本公开,并且能够将本公开的范围完整的传达给本领域的技术人员。

网页页面在设计时,为方便网页页面的维护和网页整个设计结构合理利用,可以通过在网页页面中设置框架页面的方式实现。即网页页面划分父页面和框架页面。父页面包含了如固定的页面头部、页面底部或页面两侧部分等内容的设计。框架页面通过如嵌入或引用的方式设置在父页面中。框架页面中可以包括很多如图片、文字等元素。当框架页面中包含较多元素时,为方便用户的查看,可以在框架页面中设置一个或多个的锚点,通过点击锚点,网页页面移动至相应的位置。锚点主要的工作原理是修改网页页面滚动条的高度,使网页页面移动至相应的位置。但当有时网页页面在加载时,受到框架页面和父页面的高度值影响,使得网页页面无法对应的加载页面滚动条,造成框架页面的锚点失效。如父页面的高度值大于框架页面的高度值,即父页面可以完全容纳框架页面,网页页面不需要在加载页面滚动条。因此,在加载网页页面时,对网页页面中的父页面和框架页面进行设置,以使其能正常的加载网页页面及页面滚动条。

图1示出了根据本发明一个实施例的网页页面加载的方法的流程图。如图1所示,网页页面加载的方法具体包括如下步骤:

步骤S101,接收服务端返回的待加载的网页页面。

接收的网页页面包含了父页面和框架页面。框架页面可采用如iframe标签的方式设置在父页面内。框架页面在加载时,将其加载为父页面中的一部分。

步骤S102,解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。

解析网页页面,具体的对网页页面中的代码进行解析,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。

父页面高度的配置信息记载了父页面高度为浏览器窗口高度。如父页面高度的配置信息为“height:100%”,配置父页面高度与浏览器窗口高度的比例关系为100%,即父页面的高度与浏览器窗口的高度保持一致。

框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。预设规则可以为设置框架页面高度为浏览器窗口高度,如框架页面高度的配置信息为“height:100%”,将框架页面高度也配置为与浏览器窗口高度的比例关系为100%,即父页面的高度和框架页面的高度都与浏览器窗口的高度保持一致,实现框架页面高度等于父页面高度。或者,预设规则为根据框架页面包含元素的大小设置框架页面高度为自适应高度,如框架页面高度设置为“height:auto”,根据包含元素的大小,自动调节框架页面高度。需要注意的是,自适应高度适用于框架页面包含元素较多,网页页面在显示时可能需要滚动条的情况。即此时框架页面高度大于父页面高度。

以上代码均为举例说明,具体设置时根据实际实施情况进行设置,此处不做具体限定。

步骤S103,根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。

检测当前的浏览器窗口高度值,根据服务端对父页面高度的配置信息、框架页面高度的配置信息,从而确定父页面高度值和框架页面高度值。如检测到的浏览器窗口高度值为700,父页面高度的配置信息记载了父页面高度为浏览器窗口高度,即确定父页面高度值也为700;若框架页面高度的配置信息为框架页面高度为浏览器窗口高度,即确定框架页面高度值也为700。或者,框架页面高度的配置信息为自适应高度,根据框架页面包含元素的大小设置框架页面具体的高度值,如根据框架页面包含的元素计算确定框架页面的高度值为800。

步骤S104,根据所确定的父页面高度值和框架页面高度值,加载网页页面。

根据确定的父页面高度值和框架页面高度值,加载网页页面。加载时,由于框架页面高度值大于或等于父页面高度值,即父页面不能完全显示框架页面的内容,自动的在加载时加载相应的页面滚动条,以便用户上下拖动或通过锚点设置,方便对框架页面内容的显示。

根据本发明提供的网页页面加载的方法,接收服务端返回的待加载的网页页面,网页页面包含父页面和框架页面。解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。父页面高度的配置信息记载了父页面高度为浏览器窗口高度,框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。根据所确定的父页面高度值和框架页面高度值,加载网页页面。其中,通过设置父页面高度和框架页面高度,使父页面高度为浏览器窗口高度,并根据预设规则设置框架页面的高度,将框架页面的高度设置为大于或等于父页面高度。在解析确定父页面高度值和框架页面高度值后,加载网页页面。进而使得父页面不能完全的将框架页面的元素显示在浏览器中,这样就使得在加载中框架页面中若存在锚点,锚点可用,解决了锚点失效的问题。

图2示出了根据本发明另一个实施例的网页页面加载的方法的流程图。如图2所示,网页页面加载的方法具体包括如下步骤:

步骤S201,接收服务端返回的待加载的网页页面。

步骤S202,解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。

步骤S203,根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。

步骤S204,根据所确定的父页面高度值和框架页面高度值,加载网页页面。

以上步骤可参考图1中实施例的步骤S101-S104的描述,在此不再赘述。

步骤S205,获取用户点击框架页面中锚点的操作。

步骤S206,获取锚点预先设置的定点标记,将页面滚动条移动至定点标记对应的位置。

锚点包括了锚点的链接和锚点的定点标记。用户点击框架页面中的锚点,即点击了锚点的链接。获取用户点击框架页面中锚点的操作,得到锚点的链接。锚点的链接中预先设置了要移动至位置的定点标记,获取到定点标记,找到框架页面中对应的定点标记所在的位置,将页面滚动条移动至定点标记对应的位置。

根据本发明提供的网页页面加载的方法,接收服务端返回的待加载的网页页面,解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。父页面高度的配置信息记载了父页面高度为浏览器窗口高度,框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。根据所确定的父页面高度值和框架页面高度值,加载网页页面。通过设置父页面高度和框架页面高度,使父页面高度为浏览器窗口高度,并根据预设规则设置框架页面的高度,将框架页面的高度设置为大于或等于父页面高度。在解析确定父页面高度值和框架页面高度值后,加载网页页面。由于,框架页面的高度大于或等于父页面高度,加载时相应的加载页面滚动条。在获取到锚点的操作后,相应的将网页页面移动至对应的位置。使锚点正常可用,解决了锚点失效的问题。

图3示出了根据本发明一个实施例的网页页面加载的装置的功能框图。如图3所示,网页页面加载的装置包括如下模块:

接收模块310,适于接收服务端返回的待加载的网页页面。

接收模块310接收的网页页面包含了父页面和框架页面。框架页面可采用如iframe标签的方式设置在父页面内。框架页面在加载时,将其加载为父页面中的一部分。

解析模块320,适于解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。

解析模块320解析网页页面,具体的解析模块320对网页页面中的代码进行解析,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。

父页面高度的配置信息记载了父页面高度为浏览器窗口高度。如父页面高度的配置信息为“height:100%”,配置父页面高度与浏览器窗口高度的比例关系为100%,即父页面的高度与浏览器窗口的高度保持一致。

框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。预设规则可以为设置框架页面高度为浏览器窗口高度,如框架页面高度的配置信息为“height:100%”,将框架页面高度也配置为与浏览器窗口高度的比例关系为100%,即父页面的高度和框架页面的高度都与浏览器窗口的高度保持一致,实现框架页面高度等于父页面高度。或者,预设规则为根据框架页面包含元素的大小设置框架页面高度为自适应高度,如框架页面高度设置为“height:auto”,根据包含元素的大小,自动调节框架页面高度。需要注意的是,自适应高度适用于框架页面包含元素较多,网页页面在显示时可能需要滚动条的情况。即此时框架页面高度大于父页面高度。

以上代码均为举例说明,具体设置时根据实际实施情况进行设置,此处不做具体限定。

高度确定模块330,适于根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。

高度确定模块330检测当前的浏览器窗口高度值,根据服务端对父页面高度的配置信息、框架页面高度的配置信息,从而确定父页面高度值和框架页面高度值。如高度确定模块330检测到的浏览器窗口高度值为700,父页面高度的配置信息记载了父页面高度为浏览器窗口高度,即高度确定模块330确定父页面高度值也为700;若框架页面高度的配置信息为框架页面高度为浏览器窗口高度,即高度确定模块330确定框架页面高度值也为700,框架页面高度值等于父页面高度值。或者,框架页面高度的配置信息为自适应高度,根据框架页面包含元素的大小设置框架页面具体的高度值,如高度确定模块330根据框架页面包含的元素计算确定框架页面的高度值为800,框架页面高度值大于父页面高度值。

加载模块340,适于根据所确定的父页面高度值和框架页面高度值,加载网页页面。

加载模块340根据确定的父页面高度值和框架页面高度值,加载网页页面。加载时,由于框架页面高度值大于或等于父页面高度值,即父页面不能完全显示框架页面的内容,加载模块340自动的在加载时加载相应的页面滚动条,以便用户上下拖动或通过锚点设置,方便对框架页面内容的显示。

根据本发明提供的网页页面加载的装置,接收服务端返回的待加载的网页页面,网页页面包含父页面和框架页面。解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。父页面高度的配置信息记载了父页面高度为浏览器窗口高度,框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。根据所确定的父页面高度值和框架页面高度值,加载网页页面。其中,通过设置父页面高度和框架页面高度,使父页面高度为浏览器窗口高度,并根据预设规则设置框架页面的高度,将框架页面的高度设置为大于或等于父页面高度。在解析确定父页面高度值和框架页面高度值后,加载网页页面。进而使得父页面不能完全的将框架页面的元素显示在浏览器中,这样就使得在加载中框架页面中若存在锚点,锚点可用,解决了锚点失效的问题。

图4示出了根据本发明另一个实施例的网页页面加载的装置的功能框图。与图3相比,不同之处在于,网页页面加载的装置还包括:

锚点获取模块350,适于获取用户点击框架页面中锚点的操作。

锚点移动模块360,适于获取锚点预先设置的定点标记,将页面滚动条移动至定点标记对应的位置。

锚点包括了锚点的链接和锚点的定点标记。用户点击框架页面中的锚点,即点击了锚点的链接。锚点获取模块350获取用户点击框架页面中锚点的操作,得到锚点的链接。锚点的链接中预先设置了要移动至位置的定点标记,锚点移动模块360获取到定点标记,找到框架页面中对应的定点标记所在的位置,将页面滚动条移动至定点标记对应的位置。

除此之外的其他模块均可参照图3中各模块的描述,在此不再赘述。

根据本发明提供的网页页面加载的装置,接收服务端返回的待加载的网页页面,解析网页页面,得到服务端对父页面高度的配置信息和框架页面高度的配置信息。父页面高度的配置信息记载了父页面高度为浏览器窗口高度,框架页面高度的配置信息为根据预设规则设置框架页面高度大于或等于父页面高度。根据服务端对父页面高度的配置信息、框架页面高度的配置信息和检测到的浏览器窗口高度值,确定父页面高度值和框架页面高度值。根据所确定的父页面高度值和框架页面高度值,加载网页页面。通过设置父页面高度和框架页面高度,使父页面高度为浏览器窗口高度,并根据预设规则设置框架页面的高度,将框架页面的高度设置为大于或等于父页面高度。在解析确定父页面高度值和框架页面高度值后,加载网页页面。由于,框架页面的高度大于或等于父页面高度,加载时相应的加载页面滚动条。在获取到锚点的操作后,相应的将网页页面移动至对应的位置。使锚点正常可用,解决了锚点失效的问题。

在此提供的算法和显示不与任何特定计算机、虚拟系统或者其它设备固有相关。各种通用系统也可以与基于在此的示教一起使用。根据上面的描述,构造这类系统所要求的结构是显而易见的。此外,本发明也不针对任何特定编程语言。应当明白,可以利用各种编程语言实现在此描述的本发明的内容,并且上面对特定语言所做的描述是为了披露本发明的最佳实施方式。

在此处所提供的说明书中,说明了大量具体细节。然而,能够理解,本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中,并未详细示出公知的方法、结构和技术,以便不模糊对本说明书的理解。

类似地,应当理解,为了精简本公开并帮助理解各个发明方面中的一个或多个,在上面对本发明的示例性实施例的描述中,本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而,并不应将该公开的方法解释成反映如下意图:即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说,如下面的权利要求书所反映的那样,发明方面在于少于前面公开的单个实施例的所有特征。因此,遵循具体实施方式的权利要求书由此明确地并入该具体实施方式,其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解,可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件,以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外,可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述,本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外,本领域的技术人员能够理解,尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征,但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如,在下面的权利要求书中,所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

本发明的各个部件实施例可以以硬件实现,或者以在一个或者多个处理器上运行的软件模块实现,或者以它们的组合实现。本领域的技术人员应当理解,可以在实践中使用微处理器或者数字信号处理器(DSP)来实现根据本发明实施例的网页页面加载装置中的一些或者全部部件的一些或者全部功能。本发明还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如,计算机程序和计算机程序产品)。这样的实现本发明的程序可以存储在计算机可读介质上,或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到,或者在载体信号上提供,或者以任何其他形式提供。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制,并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中,不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中,这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。

当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1