CN105354292A - 一种页面输出方法及装置 - Google Patents

Abstract

本申请提供了一种页面输出方法及装置，当检测到页面浏览请求时，可获取当前所请求浏览页面的DOM树的节点信息，以便利用该节点信息，搜索满足第一预设条件的目标叶子节点，之后，从该目标叶子节点开始，计算其所在分支中子节点占其父节点区域的百分比，并从中选择最大百分比对应的子节点为目标节点，此时，将该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出该当前所请求浏览页面，即在打开所请求的浏览页面时将直接从该目标节点对应的位置开始显示正文内容，无需用户再滚动所请求浏览页面的滚动条，就能够在打开所请求浏览页面时直接滚动到正文部分，减少了用户操作，且规避了页面广告，使用户具有良好的上网体验。

Description

一种页面输出方法及装置

技术领域

本发明涉及浏览器应用领域，更具体地说是涉及一种页面输出方法及装置。

背景技术

如今，随着互联网的快速发展，为了方便用户通过网页查看信息，市面上出现了各种各样的浏览器，如百度浏览器、QQ浏览器、360浏览器、InternetExplorer、Firefox、谷歌浏览器、UC浏览器等等，用户只要将所需浏览器安装在客户端，并将该客户端联网，就能够启动该浏览器查看所需的信息，如购物、刷微博、看视频、阅读文章等等，非常方便且实用。

在浏览器实际应用中，申请人发现，当用户使用浏览器浏览网页过程中，每次进入一个新的浏览页面，都是从该浏览页面的最顶端开始显示，然而，目前浏览页面的顶端通常都是广告页或标题栏，需要用户向下拉动该浏览页面滚动条才能看到正文，降低了用户体验。

发明内容

有鉴于此，本发明提供了一种页面输出方法及装置，解决了现有的浏览器输出浏览页面时因都从其最顶端开始显示其页面信息，必须由用户向下拉动该浏览页面滚动条才能看到其页面正文，从而降低了用户体验的技术问题。

为了实现上述目的，本申请提供了以下技术方案：

一种页面输出方法，所述方法包括：

当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息；

利用所述节点信息，搜索满足第一预设条件的目标叶子节点；

从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比；

选择计算得到的最大百分比对应的子节点为目标节点；

以所述目标节点对应的位置作为所述当前所请求浏览页面的开始输出位置，输出所述当前所请求浏览页面。

优选的，所述利用所述节点信息，搜索满足第一预设条件的目标叶子节点包括：

将所述DOM树的根节点作为初始节点，查找所述初始节点的子节点中占区域最大的节点；

将所述占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，直至所查找到的占区域最大的节点为叶子节点，将所述叶子节点作为目标叶子节点。

优选的，所述从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比包括：

将所述目标叶子节点作为初始子节点，计算所述初始子节点占其父节点区域的百分比；

将所述初始子节点的父节点作为新的初始子节点，继续计算所述新的初始子节点占其父节点区域的百分比，直至所述新的初始子节点为所述DOM树的根节点。

优选的，所述方法还包括：

记录计算得到的所述目标叶子节点所在分支中所有子节点占其父节点区域的百分比。

优选的，所述方法还包括：

将检测到的所述页面浏览请求及其所请求浏览页面的开始输出位置对应保存。

优选的，当检测到页面浏览请求时，所述方法还包括：

验证当前是否存储有所述页面浏览请求；

若是，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面；

若否，执行所述获取当前所请求浏览页面的DOM树的节点信息步骤。

一种页面输出装置，所述装置包括：

第一获取模块，用于当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息；

搜索模块，用于利用所述节点信息，搜索满足第一预设条件的目标叶子节点；

计算模块，用于从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比；

选择模块，用于选择计算得到的最大百分比对应的子节点为目标节点；

页面输出模块，用于以所述目标节点对应的位置作为所述当前所请求浏览页面的开始输出位置，输出所述当前所请求浏览页面。

优选的，所述搜索模块包括：

查找单元，用于将所述DOM树的根节点作为初始节点，查找所述初始节点的子节点中占区域最大的节点；

目标确定单元，用于将所述占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，直至所查找到的占区域最大的节点为叶子节点，将所述叶子节点作为目标叶子节点。

优选的，所述装置还包括：

第一保存模块，用于记录计算得到的所述目标叶子节点所在分支中所有子节点占其父节点区域的百分比；

第二保存模块，用于将检测到的所述页面浏览请求及其所请求浏览页面的开始输出位置对应保存。

优选的，所述装置还包括：

验证模块，用于在检测到所述页面浏览请求之后，验证当前是否存储有所述页面浏览请求；

第二获取模块，用于当所述验证模块的验证结果为是时，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面。

由此可见，与现有技术相比，本申请提供了一种页面输出方法及装置，当检测到页面浏览请求时，可获取当前所请求浏览页面的DOM树的节点信息，以便利用该节点信息，搜索满足第一预设条件的目标叶子节点，之后，从该目标叶子节点开始，计算其所在分支中子节点占其父节点区域的百分比，并从中选择最大百分比对应的子节点为目标节点，此时，将该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出该当前所请求浏览页面，即在打开所请求的浏览页面时将直接从该目标节点对应的位置开始显示正文内容，无需用户再滚动所请求浏览页面的滚动条，就能够在打开所请求浏览页面时直接滚动到正文部分，减少了用户操作，且规避了页面广告，使用户具有良好的上网体验。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。

图1为本申请提供的一种页面输出方法实施例的流程示意图；

图2为本发明提供的另一种页面输出方法实施例的部分流程示意图；

图3为本发明提供的又一种页面输出方法实施例的部分流程示意图；

图4为本发明提供的一种页面输出装置实施例的结构示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

本申请提供了一种页面输出方法及装置，当检测到页面浏览请求时，可获取当前所请求浏览页面的DOM树的节点信息，以便利用该节点信息，搜索满足第一预设条件的目标叶子节点，之后，从该目标叶子节点开始，计算其所在分支中子节点占其父节点区域的百分比，并从中选择最大百分比对应的子节点为目标节点，此时，将该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出该当前所请求浏览页面，即在打开所请求的浏览页面时将直接从该目标节点对应的位置开始显示正文内容，无需用户再滚动所请求浏览页面的滚动条，就能够在打开所请求浏览页面时直接滚动到正文部分，减少了用户操作，且规避了页面广告，使用户具有良好的上网体验。

为了使本发明的上述目的、特征和优点能够更加明显易懂，下面结合附图和具体实施方式对本发明作进一步详细的说明。

如图1所示，为本发明提供的一种页面输出方法实施例的流程示意图，该方法可以包括以下步骤：

步骤S110：当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息。

在实际应用中，用户可通过点击当前页面上所关注信息的链接或者直接输入网址或输入关键词后点击搜索，生成对应的页面浏览请求，对应服务器即可根据接收到的页面浏览请求及其携带的请求信息，向发送该页面浏览请求的客户端反馈对应的页面信息，从而使该客户端进入用户希望浏览的页面。

其中，DOM树是通过对所请求浏览页面解析得到的，本申请并不限定DOM树的具体获取方法。另外，该DOM树的所有节点都是一个Node，对于不同节点可以有不同类型，具体内容可参照现有技术中对DOM树的描述，本实施在此不再详述。

在本实施例中，所获取的节点信息可以包括该DOM树中各节点之间的关系，如父子关系，还可以包括各节点包含的子节点数量等等，本申请对此不作限定，可根据实际需要确定。

步骤S120：利用所述节点信息，搜索满足第一预设条件的目标叶子节点。

通常情况下，页面的正文部分对应DOM树的节点所占区域比较大，且包含信息量越多的部分对应节点所占区域也越大，因此，本实施例可以从DOM树的根节点开始，将该根节点作为初始节点，查找所占其区域最大子节点作为新的初始节点，继续查找该新的初始节点的子节点中占区域最大的节点，直至查找到的占区域最大的节点为叶子节点，即占区域最大的节点不再包含子节点，该叶子节点即为满足第一预设条件的目标叶子节点。

其中，上述查找所占初始节点区域最大子节点的过程，可以是通过计算初始父节点与其子节点对应的区域百分比，再从计算得到的所有区域百分比中选择最小的区域百分比对应的子节点，之后，选择的该子节点作为新的初始父节点继续按照这种方式查找，直至选择的该子节点不再包含子节点，即选择的该子节点为叶子节点。

当然，也可以计算初始父节点包含的各子节点占该初始父节点区域的百分比，此时就要选择计算得到的所有百分比中的最大百分比对应的子节点为新的初始父节点，其他过程类似，本申请在此不再详述。

需要说明的是，关于搜索目标叶子节点的方法并不局限于上述列举的几种，只要能够得到满足第一预设要求的叶子节点即可，本申请在此不再一一列举。

基于上述分析，本文在此仅以上述一种搜索方式为例，具体描述其搜索过程，如图2所示的流程图，步骤S120具体可以包括：

步骤S121：将DOM树的根节点作为初始节点，查找该初始节点的子节点中占区域最大的节点。

在实际应用中，可按照上述方式查找初始节点的子节点中占其区域最大的节点，本实施例在此不再赘述。

步骤S122：判断查找到的该占区域最大的节点是否是叶子节点，若是，执行步骤S124；若否，进入步骤S123。

其中，由于叶子节点是不包含子节点的节点，因而，本实施例可通过判断查找到的该占区域最大的节点是否包含子节点，来判定该节点是否为叶子节点。

步骤S123：将该占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，并返回步骤S122。

需要说明的是，该步骤S123的查找方式可以与上述步骤S121查找方式相同，也可以不同，本申请对此不作限定。

步骤S124：将该叶子节点作为目标叶子节点。

按照图2所示的搜索方法，由于DOM树的每个节点即为一个node，则实现该搜索方法对应的程序代码可以表示如下，但并不局限于此：

步骤S130：从该目标叶子节点开始，计算目标叶子节点所在分支中子节点占其父节点区域的百分比。

可选的，在本实施例实际应用中，如图3所示，关于步骤S130的具体计算方法可以包括：

步骤S131：将目标叶子节点作为初始子节点，计算该初始子节点占其父节点区域的百分比。

步骤S132：判断该初始子节点是否是DOM树的根节点，若是，结束流程；若否，执行步骤S133。

在本实施例实际应用中，由于根节点是没有父节点的，因而，本实施可以通过判断该初始子节点是否有父节点，来判定该初始子节点是否是DOM树的根节点。

其中，需要说明的是，当该初始子节点是DOM树的根节点时，上述结束流程仅仅是指结束步骤S130中的计算流程，而非结束本申请的页面输出流程，实际上，当该初始子节点是DOM树的根节点时，将进入步骤S140。

步骤S133：将该初始子节点的父节点作为新的初始子节点，继续计算所述新的初始子节点占其父节点区域的百分比，并返回步骤S132。

按照图3所示的计算方法，继上述搜索目标叶子节点的程序代码，实现该计算方法对应的程序代码可以表示如下，但并不局限于此：

可选的，在计算得到目标叶子节点所在分支中所有子节点占其父节点区域的百分比之后，可以记录计算得到的这些百分比，以供后续调用选择。

步骤S140：选择计算得到的最大百分比对应的子节点为目标节点。

需要说明的是，本申请对于如何从计算得到的所有子节点占其父节点区域的百分比中选择最大百分比的方法不作限定，可以两两对比，在将对比得到的较大百分比两两对比，最终得到最大百分比；也可以以任意一个百分比为基准值，将其他百分比与其比较，再将比较得到的较大百分比作为新的基准值，依次类推，从而得到最大百分比等等，本申请在此不再一一列举。

其中，计算得到的百分比越大，说明相邻位置包含的信息量差别越大，通过这种方式可以确定页面正文的开始位置。

另外，若上述步骤S130计算的是目标叶子节点所在分支中父节点与其子节点的区域百分比，那么，该步骤S150将选择计算得到的最小百分比对应的子节点为目标节点，具体选择过程与上述类似，本申请在此不再详述。

步骤S150：以该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出当前所请求浏览页面。

在实际应用中，DOM树的不同节点对应着当前请求浏览页面的不同位置，因而，本实施例通过上述计算方式得到的目标节点对应的位置通常就是所请求浏览页面正文的开始位置，所以，本实施例将以该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，即作为所请求浏览页面的最开始显示的位置，从而保证在输出当前所请求浏览页面时能够直接从该页面的正文位置开始显示，无需用户再滚动该页面的滚动条查找其正文问题，减少了用户操作，规避了页面广告，使用户具有良好的上网体验。

可选的，在上述实施例的基础上，确定当前页面浏览请求对应的目标节点之后，本申请还可以将接收到的该页面浏览请求及其所请求浏览页面的开始输出位置等信息进行对应保存，以便在此接收到该页面浏览请求时，直接调用其所请求浏览页面的开始输出位置，无需再通过上述实施例的方法重新获取该目标节点。

基于此，当检测到页面浏览请求时，本申请提供的页面输出方法还可以包括：

验证当前是否存储有该页面浏览请求，若是，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面；若否，按照上述图1所示实施例获取所请求浏览页面的开始输出位置，即其正文位置，本实施在此不再赘述。

由此可见，在该可选实施例中，当检测到该客户端发送相同页面浏览请求时，避免了按照上述方式重复计算所请求浏览页面的正文位置，提高了页面输出效率。

作为本申请又一实施例，在计算所请求浏览页面的正文开始位置之间，本申请提供的该方法还可以包括：浏览器对所请求浏览页面进行渲染，具体方法可按照现有技术，本申请在此不再详述。

如图4所示，为本申请提供的一种页面输出装置实施例的结构示意图，该装置可以包括：

第一获取模块410，用于当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息。

其中，该节点信息可以包括该DOM树中各节点对应的位置，如对应该页面浏览请求所请求浏览页面的位置，还可以包括各节点的占的区域，以及相互之间的关系，每个节点包含的子节点数量等等，本申请对此不作具体限定，可根据实际需要确定。

搜索模块420，用于利用所述节点信息，搜索满足第一预设条件的目标叶子节点。

可选的，在本实际应用中，该搜索模块420可以包括：

查找单元421，用于将所述DOM树的根节点作为初始节点，查找所述初始节点的子节点中占区域最大的节点。

目标确定单元422，用于将所述占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，直至所查找到的占区域最大的节点为叶子节点，将所述叶子节点作为目标叶子节点。

其中，该目标确定单元确定目标叶子节点的过程可参照上述方法实施例对应部分的描述，本实施在此不再赘述。

另外，需要说明的是，对于搜索模块420搜索满足第一预设要求的目标叶子节点的方式并不局限于上述实施例描述的方式，具体可以参照上述方法实施例对应部分的描述，本实施在此不再一一列举。

计算模块430，用于从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比。

在本实施例实际应用中，该计算模块430可以包括：

计算单元，用于将所述目标叶子节点作为初始子节点，计算所述初始子节点占其父节点区域的百分比；

确定单元，用于将所述初始子节点的父节点作为新的初始子节点，继续计算所述新的初始子节点占其父节点区域的百分比，直至所述新的初始子节点为所述DOM树的根节点。

选择模块440，用于选择计算得到的最大百分比对应的子节点为目标节点。

其中，本实施例对该选择模块440选择目标节点的具体过程不作限定，可参照上述方法实施例对应部分的描述，本实施在此不再赘述。

页面输出模块450，用于以该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出所述当前所请求浏览页面。

综上所述，在本实施例中，当检测到页面浏览请求时，可获取当前所请求浏览页面的DOM树的节点信息，以便利用该节点信息，搜索满足第一预设条件的目标叶子节点，之后，从该目标叶子节点开始，计算其所在分支中子节点占其父节点区域的百分比，并从中选择最大百分比对应的子节点为目标节点，此时，将该目标节点对应的位置作为当前所请求浏览页面的开始输出位置，输出该当前所请求浏览页面，即在打开所请求的浏览页面时将直接从该目标节点对应的位置开始显示正文内容，无需用户再滚动所请求浏览页面的滚动条，就能够在打开所请求浏览页面时直接滚动到正文部分，减少了用户操作，且规避了页面广告，使用户具有良好的上网体验。

可选的，在上述实施例的基础上，页面输出装置还可以包括：

第一保存模块，用于记录计算得到的所述目标叶子节点所在分支中所有子节点占其父节点区域的百分比。

第二保存模块，用于将接收到的所述页面浏览请求及其所请求浏览页面的开始输出位置对应保存。

当然，该第二保存模块还可以将获取的DOM树中的目标节点与接收到的页面浏览请求对应保存等等，本申请对此不作限定，具体可根据实际需要确定。

基于此，该装置还可以包括：

验证模块，用于在检测到所述页面浏览请求之后，验证当前是否存储有所述页面浏览请求。

其中，当该验证模块的验证结果为否，即当前并未存储检测到的页面浏览请求，可以直接触发上述第一获取模块410获取当前所请求浏览页面的DOM树的节点信息。

第二获取模块，用于当所述验证模块的验证结果为是时，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面。

可见，该可选实施例中，当检测到该客户端发送相同页面浏览请求时，避免了按照上述方式重复计算所请求浏览页面的正文位置，提高了页面输出效率。

此外，作为本申请又一实施例，该装置还可以包括：

渲染模块，用于对所请求浏览页面进行渲染，本申请对该渲染具体方法不作限定，可参照现有的网页渲染方法，本实施例在此不再详述。

最后，需要说明的是，关于上述各实施例中，诸如第一、第二等之类的关系术语仅仅用来将一个操作或单元与另一个操作或单元区分开来，而不一定要求或者暗示这些单元或操作之间存在任何这种实际的关系或者顺序。

本说明书中各个实施例采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似部分互相参见即可。对于实施例公开的装置而言，由于其与实施例公开的方法对应，所以描述的比较简单，相关之处参见方法部分说明即可。

对所公开的实施例的上述说明，使本领域专业技术人员能够实现或使用本发明。对这些实施例的多种修改对本领域的专业技术人员来说将是显而易见的，本文中所定义的一般原理可以在不脱离本发明的精神或范围的情况下，在其它实施例中实现。因此，本发明将不会被限制于本文所示的这些实施例，而是要符合与本文所公开的原理和新颖特点相一致的最宽的范围。

Claims (10)

1.一种页面输出方法，其特征在于，所述方法包括：

当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息；

利用所述节点信息，搜索满足第一预设条件的目标叶子节点；

从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比；

选择计算得到的最大百分比对应的子节点为目标节点；

以所述目标节点对应的位置作为所述当前所请求浏览页面的开始输出位置，输出所述当前所请求浏览页面。

2.根据权利要求1所述的方法，其特征在于，所述利用所述节点信息，搜索满足第一预设条件的目标叶子节点包括：

将所述DOM树的根节点作为初始节点，查找所述初始节点的子节点中占区域最大的节点；

将所述占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，直至所查找到的占区域最大的节点为叶子节点，将所述叶子节点作为目标叶子节点。

3.根据权利要求1所述的方法，其特征在于，所述从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比包括：

将所述目标叶子节点作为初始子节点，计算所述初始子节点占其父节点区域的百分比；

将所述初始子节点的父节点作为新的初始子节点，继续计算所述新的初始子节点占其父节点区域的百分比，直至所述新的初始子节点为所述DOM树的根节点。

4.根据权利要求1所述的方法，其特征在于，所述方法还包括：

记录计算得到的所述目标叶子节点所在分支中所有子节点占其父节点区域的百分比。

5.根据权利要求1所述的方法，其特征在于，所述方法还包括：

将检测到的所述页面浏览请求及其所请求浏览页面的开始输出位置对应保存。

6.根据权利要求5所述的方法，其特征在于，当检测到页面浏览请求时，所述方法还包括：

验证当前是否存储有所述页面浏览请求；

若是，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面；

若否，执行所述获取当前所请求浏览页面的DOM树的节点信息步骤。

7.一种页面输出装置，其特征在于，所述装置包括：

第一获取模块，用于当检测到页面浏览请求时，获取当前所请求浏览页面的DOM树的节点信息；

搜索模块，用于利用所述节点信息，搜索满足第一预设条件的目标叶子节点；

计算模块，用于从所述目标叶子节点开始，计算所述目标叶子节点所在分支中子节点占其父节点区域的百分比；

选择模块，用于选择计算得到的最大百分比对应的子节点为目标节点；

页面输出模块，用于以所述目标节点对应的位置作为所述当前所请求浏览页面的开始输出位置，输出所述当前所请求浏览页面。

8.根据权利要求7所述的装置，其特征在于，所述搜索模块包括：

查找单元，用于将所述DOM树的根节点作为初始节点，查找所述初始节点的子节点中占区域最大的节点；

目标确定单元，用于将所述占区域最大的节点作为新的初始节点，继续查找所述新的初始节点的子节点中占区域最大的节点，直至所查找到的占区域最大的节点为叶子节点，将所述叶子节点作为目标叶子节点。

9.根据权利要求1所述的装置，其特征在于，所述装置还包括：

第一保存模块，用于记录计算得到的所述目标叶子节点所在分支中所有子节点占其父节点区域的百分比；

第二保存模块，用于将检测到的所述页面浏览请求及其所请求浏览页面的开始输出位置对应保存。

10.根据权利要求9所述的装置，其特征在于，所述装置还包括：

验证模块，用于在检测到所述页面浏览请求之后，验证当前是否存储有所述页面浏览请求；

第二获取模块，用于当所述验证模块的验证结果为是时，获取与所述页面浏览请求对应的开始输出位置，并利用所获取的开始输出位置，输出当前所请求浏览页面。