一种网页呈现设备和方法

xiaoxiao2020-7-22  16

一种网页呈现设备和方法
【专利摘要】本发明公开一种网页呈现设备和方法,属于互联网【技术领域】。网页呈现方法包括:服务器端根据包括多个数据项目的数据内容构造网页文件和脚本文件,网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用;浏览器解析网页文件,对多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素,当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以根据各数据项目之间的逻辑关系切换当前显示的页面元素。本发明实现了在浏览器中以分页方式显示数据内容,并提高了浏览器的网页显示速度,降低了服务器端的负载。
【专利说明】一种网页呈现设备和方法
【技术领域】
[0001]本发明涉及互联网【技术领域】,具体涉及一种网页呈现设备和方法。
【背景技术】
[0002]中国互联网信息中心(ChinaInternet Network Information Center,CNNIC)调查报告显示,截至到2013年6月底,我国网民规模达5.91亿。而随着互联网的快速发展,网络成为人们购物、获取资讯和沟通交流的第一渠道,一些传统的商业也快速迁移到互联网上。
[0003]企业为了更好地收集用户反馈信息,需要发布调查问卷。传统调查问卷需要耗费大量的人力、时间和财力,对问卷结果的统计也会有偏差及延迟,因此迫切需要一款能够满足需求的在线调查问卷系统。
[0004]如图6所示,现有的在线调查问卷的一种实现方式为,将调查问卷的所有试题在一个网页中呈现出来,其缺点在于:没有对试题进行分页呈现,缺少与用户之间的交互性;没有逻辑跳转,一些选择性显示的试题无法展现,例如:不能根据男性用户展现符合男性的试题。
[0005]现有的在线调查问卷的另一种实现方式为,通过动态请求服务器实现试题的分页,即每次在网页上呈现一个试题,在获取到用户对该试题的答案之后,从服务器端下载下一个试题后进行呈现。该种实现方式虽然提供了对试题的分页,但是每显示一页,都需要与服务器端进行交互,例如发送http请求到服务器端,根据服务器端的响应进行当前内容的显示。由于存在与服务器端的多重交互,一方面降低了网页呈现的速度,页面打开时间变长,另一方面也增加了服务器端(网站)的负载。

【发明内容】

[0006]鉴于上述问题,提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的网页呈现设备和方法。
[0007]根据本发明的一个方面,提供了一种网页呈现方法,适于在浏览器中执行,所述方法包括:
[0008]从服务器端获取网页文件和脚本文件,所述网页文件和脚本文件由服务器端根据包括多个数据项目的数据内容构造得到,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素;
[0009]解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素;以及
[0010]当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
[0011]根据本发明的另一方面,提供了一种网页呈现方法,适于在服务器端执行,所述方法包括:
[0012]根据包括多个数据项目的数据内容构造网页文件和脚本文件,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素;
[0013]根据浏览器的请求将所构造的网页文件和脚本文件返回给浏览器,以供浏览器解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素,以及,当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
[0014]根据本发明的又一方面,提供了一种网页呈现设备,驻留在浏览器中,所述设备包括:
[0015]请求单元,适于从服务器端获取网页文件和脚本文件,所述网页文件和脚本文件由服务器端根据包括多个数据项目的数据内容构造得到,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素;
[0016]解析单元,适于解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素;以及
[0017]处理单元,适于当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
[0018]根据本发明的又一方面,提供了一种网页呈现设备,驻留在服务器端,所述设备包括:
[0019]构造单元,适于根据包括多个数据项目的数据内容构造网页文件和脚本文件,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素;
[0020]响应单元,适于根据浏览器的请求将所构造的网页文件和脚本文件返回给浏览器,以供浏览器解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素,以及,当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素
[0021]可选地,所述第一页面元素和第二页面元素为<div>标签,且所述脚本通过更改<div>标签的” display”属性来切换当前显示的页面元素。
[0022]可选地,所述数据内容包括第一数据条目列表和第二数据条目列表,且每个数据项目包括第一数据条目列表中的一个数据条目和第二数据条目列表中与该第一数据条目对应的第二数据条目。
[0023]可选地,所述第一页面元素对应的<div>标签为嵌套结构,其中外层<div>标签的内容为数据内容所在的页码,内层<div>标签的内容为第一数据条目以及与该第一数据条目对应的第二数据条目,所述第二页面元素对应的<div>标签的内容为按钮,所述按钮引用的脚本适于根据对第一数据条目对应的第二数据条目的选择结果切换当前显示的页面元素。
[0024]根据本发明的又一方面,提供了一种网页呈现系统,所述系统包括浏览器和服务器端,所述浏览器与所述服务器端通信连接,且所述浏览器包括驻留在其中的上述网页呈现设备,所述服务器端包括驻留在其中的上述网页呈现设备。
[0025]根据本发明上述的一个或多个技术方案,通过一次生成静态网页文件(例如html文件),数据内容在浏览器端一次下载完成,并通过在浏览器端执行脚本来根据数据内容中各数据项目之间的逻辑关系实现数据内容的分页呈现,由于不需要与服务器端进行多重交互,因而提高了浏览器的网页显示速度,并降低了服务器端的负载。
[0026]上述说明仅是本发明技术方案的概述,为了能够更清楚了解本发明的技术手段,而可依照说明书的内容予以实施,并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂,以下特举本发明的【具体实施方式】。
【专利附图】

【附图说明】
[0027]通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本发明的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:
[0028]图1示出了根据本发明一个实施例的网页呈现系统的结构图;
[0029]图2示出了根据本发明一个实施例的服务器端中网页呈现设备的结构图;
[0030]图3示出了根据本发明一个实施例的浏览器中网页呈现设备的结构图;
[0031]图4示出了根据本发明一个实施例的服务器端中网页呈现方法的流程图;
[0032]图5示出了根据本发明一个实施例的浏览器中网页呈现方法的流程图;
[0033]图6示出了现有的一种在线调查问卷的呈现界面;以及
[0034]图7示出了根据本发明实施例的技术方案实现的一种在线调查问卷的呈现界面。【具体实施方式】
[0035]下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例,然而应当理解,可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反,提供这些实施例是为了能够更透彻地理解本公开,并且能够将本公开的范围完整的传达给本领域的技术人员。
[0036]图1示出了根据本发明一个实施例的网页呈现系统的结构图。如图1所示,网页呈现系统包括多个客户端110(图中示出了 3个)、为这些客户端110提供各种网络资源的服务器端120,客户端110和服务器端120经由互联网络而相互通信。
[0037]在本发明实施例中,客户端110可以是本领域任何可以呈现从服务器端120获取的网络资源的设备,包括但不限于桌面型计算机、笔记本式计算机、个人数字助理、智能移动终端和平板电脑等。客户端110上运行有浏览器,所述浏览器能够呈现从服务器端120获取的网页文件(例如html文件)。
[0038]服务器端120可以根据数据存储器130中存储的数据内容来构造网页文件和脚本文件,其中,数据存储器130例如为数据库中存储的数据内容包括多个数据项目。服务器端120所构造的网页文件包括多个第一页面元素和多个第二页面元素(例如为按钮),每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素。
[0039]需要说明的是,数据存储器130可以部署在与服务器端120通信连接的设备中,也可以直接部署在服务器端120,本发明实施例对此不做限制。另外,服务器端120所构造的脚本文件可以是独立的文件,也可以是网页文件的一部分(即网页文件中包括各种脚本),本发明实施例对此也不做限制。
[0040]用户通过客户端110中的浏览器访问服务器端120,服务器端120应浏览器的请求而将所请求的网页文件和脚本文件返回给浏览器,为便于网页的显示,服务器端120通常还会将与网页相关的其他文件例如CSS(Cascading Style Sheets,层叠样式表)文件一并返回给浏览器。
[0041]在本发明实施例中,服务器端120构造的网页文件为静态网页文件,该静态网页文件中包括需要在浏览器中进行分页呈现的多个数据项目。也就是说,服务器端120是一次性将需要在浏览器中分页呈现的所有数据内容都返回给浏览器。
[0042]浏览器获取到网页文件和脚本文件后,解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素。如前所述,所述网页文件中包括有需要在浏览器中进行分页呈现的多个数据项目,根据对网页文件的设计,浏览器解析所述文件后,根据解析结果,会呈现多个数据项目中的一个初始数据项目,即将所述初始数据项目在当前网页中进行呈现。
[0043]用户浏览完当前呈现的数据项目(有可能还对该数据项目进行相关的操作),为使得在下一个网页中呈现下一个数据项目,会触发当前在第一页面元素中呈现的第二页面元素,例如,单击第一页面元素中的按钮。浏览器检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。如此,实现了对多个数据项目的分页显示。
[0044]根据本发明实施例的网页呈现系统,通过一次生成静态网页文件(例如html文件),数据内容在浏览器端一次下载完成,并通过在浏览器端执行脚本来根据数据内容中各数据项目之间的逻辑关系实现数据内容的分页呈现,由于不需要与服务器端进行多重交互,因而提高了浏览器的网页显示速度,并降低了服务器端的负载。
[0045]以下对本发明实施例的网页呈现系统中的服务器端120以及客户端110中浏览器的具体构成进行详细说明,其中,所述服务器端120中包括网页呈现设备200,所述浏览器中包括网页呈现设备300。
[0046]图2示出了根据本发明一个实施例的服务器端120中网页呈现设备200的结构图。如图2所示,网页呈现设备200包括构造单元210和响应单元220。
[0047]构造单元210适于根据包括多个数据项目的数据内容构造网页文件和脚本文件,所述数据内容可以来自于前述的数据存储器130。其中,所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本(例如JS脚本)适于根据各数据项目之间的逻辑关系切换当前显示的页面元素。
[0048]所述第一页面元素和第二页面元素可以采用<div>标签,这样,所述脚本文件中的脚本可以通过更改<div>标签的” display”属性来切换当前显示的页面元素。具体地,通过将<div>标签的”display”属性设置为”display:none”来隐藏该<div>标签,通过将<div>标签的” display”属性设置为” display:block”来呈现该<div>标签。
[0049]所述数据内容可以包括第一数据条目列表和第二数据条目列表,且每个数据项目包括第一数据条目列表中的一个数据条目和第二数据条目列表中与该第一数据条目对应的第二数据条目。
[0050]例如,当所述数据内容为调查问卷的试题时,第一数据条目列表可以为调查问卷的试题的题目表,第二数据条目列表可以为调查问卷的试题的问题选项表。这样,每个数据项目就包括题目表中的一个题目和问题选项表中与该题目对应的选项内容。[0051 ] 当所述数据内容包括第一数据条目列表和第二数据条目列表的情况下,所述第一页面元素对应的<div>标签可以为嵌套结构,其中外层<div>标签的内容为数据内容所在的页码,内层<div>标签的内容为第一数据条目以及与该第一数据条目对应的第二数据条目,所述第二页面元素对应的<div>标签的内容为按钮,所述按钮引用的脚本适于根据对第一数据条目对应的第二数据条目的选择结果切换当前显示的页面元素。所述按钮可以包括“继续”按钮和“返回”按钮,当用户点击“继续”按钮时,在网页中显示当前页面的下一个页面,当用户点击“返回”按钮时,在网页中显示当前页面的上一个页面。
[0052]继续以所述数据内容为调查问卷的试题为例,构造单元210所构造的网页文件中的<div>标签示例如下:
[0053]
【权利要求】
1.一种网页呈现方法,适于在浏览器中执行,所述方法包括: 从服务器端获取网页文件和脚本文件,所述网页文件和脚本文件由服务器端根据包括多个数据项目的数据内容构造得到,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素; 解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素;以及 当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
2.如权利要求1所 述的网页呈现方法,其中,所述第一页面元素和第二页面元素为<div>标签,且所述脚本通过更改<div>标签的” display”属性来切换当前显示的页面元素。
3.如权利要求2所述的网页呈现方法,其中,所述数据内容包括第一数据条目列表和第二数据条目列表,且每个数据项目包括第一数据条目列表中的一个数据条目和第二数据条目列表中与该第一数据条目对应的第二数据条目。
4.如权利要求3所述的网页呈现方法,其中,所述第一页面元素对应的<div>标签为嵌套结构,其中外层<div>标签的内容为数据内容所在的页码,内层<div>标签的内容为第一数据条目以及与该第一数据条目对应的第二数据条目,所述第二页面元素对应的<div>标签的内容为按钮,所述按钮引用的脚本适于根据对第一数据条目对应的第二数据条目的选择结果切换当前显示的页面元素。
5.一种网页呈现方法,适于在服务器端执行,所述方法包括: 根据包括多个数据项目的数据内容构造网页文件和脚本文件,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素; 根据浏览器的请求将所构造的网页文件和脚本文件返回给浏览器,以供浏览器解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素,以及,当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
6.如权利要求5所述的网页呈现方法,其中,所述第一页面元素和第二页面元素为<div>标签,且所述脚本通过更改<div>标签的” display”属性来切换当前显示的页面元素。
7.如权利要求6所述的网页呈现方法,其中,所述数据内容包括第一数据条目列表和第二数据条目列表,且每个数据项目包括第一数据条目列表中的一个数据条目和第二数据条目列表中与该第一数据条目对应的第二数据条目。
8.—种网页呈现设备,驻留在浏览器中,所述设备包括:请求单元,适于从服务器端获取网页文件和脚本文件,所述网页文件和脚本文件由服务器端根据包括多个数据项目的数据内容构造得到,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素; 解析单元,适于解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素;以及 处理单元,适于当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
9.一种网页呈现设备,驻留在服务器端,所述设备包括: 构造单元,适于根据包括多个数据项目的数据内容构造网页文件和脚本文件,其中所构造的网页文件包括多个第一页面元素和多个第二页面元素,每个第一页面元素包括数据内容中的一个数据项目,每个第二页面元素包括对脚本文件中脚本的引用,所引用的脚本适于根据各数据项目之间的逻辑关系切换当前显示的页面元素; 响应单元,适于根据浏览器的请求将所构造的网页文件和脚本文件返回给浏览器,以供浏览器解析所述网页文件,对所述多个第一页面元素中的一个页面元素进行呈现,并在所呈现的第一页面元素之上呈现相应的第二页面元素,以及,当检测到对第二页面元素的触发时,执行第二页面元素引用的脚本,以隐藏当前显示的第一页面元素和第二页面元素,并呈现与当前隐藏的第一页面元素相关联的第一页面元素和对应的第二页面元素。
10.一种网页呈现系统,所述系统包括浏览器和服务器端,所述浏览器与所述服务器端通信连接,且所述浏览器包括如权利要求8所述的网页呈现设备,所述服务器端包括如9所述的网页呈现设备。
【文档编号】G06F17/30GK103927383SQ201410177926
【公开日】2014年7月16日 申请日期:2014年4月29日 优先权日:2014年4月29日
【发明者】安凯 申请人:车智互联(北京)科技有限公司

最新回复(0)