网页渲染方法及装置的制造方法

文档序号:10594127阅读:150来源:国知局
网页渲染方法及装置的制造方法
【专利摘要】本公开是关于一种网页渲染方法及装置,属于互联网技术领域。所述方法包括:获取待渲染网页的网页源代码;检测网页源代码中的元素节点是否符合预设节点特征;元素节点与待渲染网页中的网页素材资源对应,预设节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果;当元素节点符合预设节点特征时,停止对该元素节点对应网页素材资源的渲染操作。本公开解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
【专利说明】
网页渲染方法及装置
技术领域
[0001]本公开涉及互联网技术领域,特别涉及一种网页渲染方法及装置。
【背景技术】
[0002]随着互联网技术的不断发展,网页中被插入各式各样的广告,而插入网页的广告会占用部分网页显示区域,影响用户的正常浏览。
[0003]相关技术中,浏览器中预先配置广告资源列表,该广告资源列表中存储有广告资源的URL (Uniform Resource Locator,统一资源定位符)地址。浏览器在加载网页时,即根据该广告资源列表识别出网页中包含的广告资源并进行过滤,从而解决了网页中的广告占用部分网页显示区域,影响用户正常浏览的问题。但是相关技术中,广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响。

【发明内容】

[0004]本公开实施例提供了一种网页渲染方法及装置,该技术方案如下:
[0005]根据本公开实施例的第一方面,提供一种网页清染方法,该方法包括:
[0006]获取待渲染网页的网页源代码;
[0007]检测网页源代码中的元素节点是否符合预设节点特征;元素节点与待渲染网页中的网页素材资源对应,预设节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果;
[0008]当元素节点符合预设节点特征时,停止对元素节点对应网页素材资源的渲染操作。
[0009]在一个可选的实施例中,检测网页源代码中的元素节点是否符合预设节点特征,包括:
[0010]检测元素节点是否符合节点CSS(Cascading Style Sheets,层叠样式表)特征;节点CSS特征用于指示元素节点对应的网页素材资源的显示样式。
[0011]在一个可选的实施例中,检测所述元素节点是否符合节点CSS特征,包括:
[0012I获取元素节点对应的posit1n(位置)属性;检测posit1n属性是否指示所述元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当posit1n属性指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定元素节点符合节点CSS特征;
[0013]和/或,
[0014I获取元素节点对应的top (顶部)属性以及bottom (底部)属性;检测top属性以及bottom属性是否指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端;当top属性以及bottom属性指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端时,确定元素节点符合节点CSS特征;
[0015]和/或,[ΟΟ??]获取元素节点对应的width (宽度)属性;检测width属性是否指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当width属性指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定元素节点符合节点CSS特征。
[0017]在一个可选的实施例中,检测网页源代码中的元素节点是否符合预设节点特征,还包括:
[0018]检测元素节点是否符合节点内容特征;节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0019]在一个可选的实施例中,检测元素节点是否符合节点内容特征,包括:
[0020]检测元素节点对应的文字显示内容中是否包含预定关键词;当元素节点对应的文字显示内容中包含预定关键词时,确定元素节点符合节点内容特征;
[0021]和/或,
[0022]检测元素节点中是否包含用于显示关闭组件的代码;当元素节点中包含用于显示关闭组件的代码时,确定元素节点符合节点内容特征。
[0023]在一个可选的实施例中,当元素节点符合预设节点特征时,停止对元素节点对应网页素材资源的渲染操作,包括:
[0024]若元素节点符合预设节点特征,则将DOM tree (Document Object Model tree,文档对象化模型树)中,元素节点对应的DOM node的display(显示)属性设置为none,D0Mtree由网页源代码解析构建得到j#D0M node对应的RenderOb ject(清染对象)从Rendertree(清染树)中删除,Render tree根据DOM tree生成,Render tree中的RenderObject与DOM tree 中的DOM node对应。
[0025]或,
[0026]若元素节点符合预设节点特征,则根据网页源代码重新解析构建DOMtree,并删除DOM tree中元素节点对应的DOM node ;根据重新解析构建后的DOM tree生成Rendertree ;根据Render tree进行网页素材资源的清染操作。
[0027]其中,Rendertree用于对网页素材资源进行渲染操作。
[0028]根据本公开实施例的第二方面,提供一种网页渲染装置,该装置包括:
[0029]获取模块,被配置为获取待渲染网页的网页源代码;
[0030]检测模块,被配置为检测网页源代码中的元素节点是否符合预设节点特征;元素节点与所述待渲染网页中的网页素材资源对应,预设节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果;
[0031]停止模块,被配置为若元素节点符合预设节点特征,则停止对元素节点对应网页素材资源的渲染操作。
[0032]在一个可选的实施例中,检测模块,包括:
[0033]样式检测子模块,被配置为检测元素节点是否符合节点CSS特征;节点CSS特征用于指示元素节点对应的网页素材资源的显示样式。
[0034]在一个可选的实施例中,样式检测子模块,包括:
[0035]第一样式检测子模块,被配置为获取元素节点对应的posit 1n属性;检测posit1n属性是否指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当posit1n属性指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定元素节点符合节点CSS特征;
[0036]和/或,
[0037]第二样式检测子模块,被配置为获取元素节点对应的top属性以及bottom属性;检测top属性以及bottom属性是否指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端;当top属性以及bottom属性指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端时,确定元素节点符合节点CSS特征;
[0038]和/或,
[0039]第三样式检测子模块,被配置为获取元素节点对应的width属性;检测width属性是否指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当width属性指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定元素节点符合节点CSS特征。
[0040]在一个可选的实施例中,检测模块,还包括:
[0041]内容检测子模块,被配置为检测元素节点是否符合节点内容特征;节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0042]在一个可选的实施例中,内容检测子模块,包括:
[0043]第一检测子模块,被配置为检测元素节点对应的文字显示内容中是否包含预定关键词;当元素节点对应的文字显示内容中包含预定关键词时,确定元素节点符合节点内容特征;
[0044]和/或,
[0045]第二检测子模块,被配置为检测元素节点中是否包含用于显示关闭组件的代码;当元素节点中包含用于显示关闭组件的代码时,确定元素节点符合节点内容特征。
[0046]在一个可选的实施例中,停止模块,包括:
[0047]第一停止子模块,被配置为若元素节点符合预设节点特征,则将DOMtree中,所述元素节点对应的DOM node的display属性设置为none,D0M tree由网页源代码解析构建得至丨J;将DOM node对应的RenderOb ject从清染树Render tree中删除,Render tree根据DOMtree生成,Render tree中的RenderObject与DOM tree中的DOM node对应。
[0048]或,
[0049]第二停止子模块,被配置为若元素节点符合预设节点特征,则根据网页源代码重新解析构建DOM tree,并删除DOM tree中该元素节点对应的DOM node;根据重新解析构建后的DOM tree生成Render tree;
[0050]其中,Rendertree用于对网页素材资源进行渲染操作。
[0051 ]根据本公开实施例的第三方面,提供一种网页渲染装置,该装置包括:
[0052]处理器;
[0053]用于存储处理器的可执行指令的存储器;
[0054]其中,处理器被配置为:
[0055]获取待渲染网页的网页源代码;
[0056]检测网页源代码中的元素节点是否符合预设节点特征;元素节点与待渲染网页中的网页素材资源对应,预设节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果;
[0057]若元素节点符合预设节点特征,则停止对元素节点对应网页素材资源的渲染操作。
[0058]本公开实施例提供的技术方案可以包括以下有益效果:
[0059]通过在渲染网页时,对网页源代码中各个元素节点的节点特征进行分析,将符合预设节点特征的元素节点确定为广告节点,并停止对广告节点的渲染;解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
[0060]应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。
【附图说明】
[0061]此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理。
[0062]图1是根据一示例性实施例示出的网页渲染方法的方法流程图;
[0063]图2A是根据另一示例性实施例示出的网页渲染方法的方法流程图;
[0064]图2B是根据再一示例性实施例示出的网页渲染方法的方法流程图;
[0065]图2C是根据又一示例性实施例示出的网页渲染方法的方法流程图;
[0066]图2D是根据还一示例性实施例示出的网页渲染方法的方法流程图;
[0067]图3是根据一示例性实施例示出的网页渲染装置的结构方框图;
[0068]图4是根据另一示例性实施例示出的网页渲染装置的结构方框图;
[0069]图5是根据一示例性实施例示出的网页渲染装置的框图。
[0070]通过上述附图,已示出本公开明确的实施例,后文中将有更详细的描述。这些附图和文字描述并不是为了通过任何方式限制本公开构思的范围,而是通过参考特定实施例为本领域技术人员说明本公开的概念。
【具体实施方式】
[0071]这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
[0072]本公开各个实施例提供的网页渲染方法,用于安装有网页浏览器的电子设备中,该电子设备可以是智能手机、平板电脑、电子书阅读器或便携式计算机等等,本公开实施例并不对电子设备的类型进行限定。
[0073]图1是根据一示例性实施例示出的网页渲染方法的方法流程图,本实施例以该网页渲染方法用于安装有网页浏览器的电子设备来进行说明,该网页渲染方法可以包括如下步骤。
[0074]在步骤101中,获取待渲染网页的网页源代码。
[0075]在步骤103中,检测网页源代码中的元素节点是否符合预设节点特征;元素节点与待渲染网页中的网页素材资源对应,预设节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果。
[0076]预设节点特征是通过对网页中广告的显示特征进行分析得到的。该预设节点特征可以包括元素节点的节点CSS特征和节点内容特征中的至少一种,其中,CSS特征用于指示元素节点对应的网页素材资源的显示样式,节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0077]在步骤105中,当元素节点符合预设节点特征时,停止对该元素节点对应网页素材资源的渲染操作。
[0078]对于符合预设节点特征的元素节点,电子设备将其确定为广告节点,并停止对该广告节点对应的素材资源进行渲染,从而起到广告拦截的效果。
[0079]比如,当元素节点符合节点CSS特征时,确定该元素节点为广告节点;又比如,当元素节点符合节点内容特征,确定该元素节点为广告节点;再比如,当元素节点符合节点CSS特征以及节点内容特征时,确定该元素节点为广告节点。
[0080]相较于相关技术中根据广告资源列表进行广告的过滤,本实施例提供的网页渲染方法中,由于网页中广告的显示特征较为明显且变化较小,预设节点特征不需要进行频繁的更新,显著降低了广告过滤的难度和成本;并且,网页浏览器在进行网页渲染时无需对广告资源对应的元素节点进行渲染,能够提升网页浏览器的渲染速度和性能。
[0081]综上所述,本实施例提供的网页渲染方法,通过在渲染网页时,对网页源代码中各个元素节点的节点特征进行分析,将符合预设节点特征的元素节点确定为广告节点,并停止对广告节点的渲染;解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
[0082]对大量网页广告分析发现,网页中出现的广告具有明显的显示样式特征和显示内容特征。比如,对于网页中的悬浮条广告,无论用户如何滚动网页页面,悬浮条广告在浏览器显示区域内的显示位置保持不变(显示样式特征);又比如,网页中广告的显示内容中通常包含特定的广告关键词(显示内容特征),因此,网页浏览器可以通过检测各个元素节点的节点CSS特征和节点内容特征识别出广告节点。
[0083]图2A是根据另一示例性实施例示出的网页渲染方法的方法流程图,本实施例以该网页渲染方法用于安装有网页浏览器的电子设备来进行说明,该网页渲染方法可以包括如下步骤。
[0084]在步骤201中,获取待渲染网页的网页源代码。
[0085]用户使用电子设备中的网页浏览器浏览网页时,网页浏览器从网页服务器处获取该网页的网页源代码,比如,该网页源代码可以是网页的HTML (Hyper T ext MarkupLanguage,超文本标记语言)代码。
[0086]通常情况下,网页中包含大量网页素材资源,比如图片资源、文字资源和视频资源等等,各个网页素材资源分别对应网页源代码中不同的元素节点。网页浏览器内核进行网页页面渲染时,即对各个网页素材资源对应的元素节点进行渲染。本实施例提供的网页渲染方法用于网页浏览器内核渲染网页页面阶段。
[0087]在步骤202中,检测网页源代码中的元素节点是否符合节点CSS特征;节点CSS特征用于指示元素节点对应的网页素材资源的显示样式。
[0088]网页中显示的广告存在一些明显的显示样式特征,以网页中的悬浮条广告为例,不论用户如何滚动网页页面,悬浮条广告在网页浏览器界面中显示的位置固定不变;悬浮条广告通常位于网页的顶端或底端;悬浮条广告的宽度通常与浏览器界面的显示宽度相同。
[0089]上述显示样式均通过广告节点对应的CSS实现,因此,网页浏览器内核在渲染阶段可以对各个元素节点的CSS进行分析,确定元素节点是否符合广告节点的节点CSS特征,从而进一步识别出元素节点中包含的广告节点。其中,元素节点的CSS可以采用外联式、嵌入式或内联式,本实施例并不对此进行限定。
[0090]在步骤203中,检测网页源代码中的元素节点是否符合节点内容特征;节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0091]仅根据元素节点的节点CSS特征来判断其是否为广告节点可能会导致错误过滤。比如,部分社交网页上存在工具栏,不论用户如何滚动页面,该工具栏均显示在网页的固定位置,其对应的元素节点符合广告节点的节点CSS特征,若对该工具栏进行过滤会导致用户无法使用工具栏。
[0092]通过对网页中的广告进行分析发现,网页上的广告除了具有明显的CSS特征外,还具有明显的显示内容特征,比如,广告中会出现广告关键词以及关闭广告的按钮。
[0093]因此,为了提高过滤的准确性,当检测到网页源代码中的元素节点符合节点CSS特征时,将该元素节点确定为疑似广告节点,并进一步检测该疑似广告节点是否符合节点内容特征。当该疑似广告节点符合节点内容特征时,确定该疑似广告节点为广告节点,并执行步骤204;当该疑似广告节点不符合节点内容特征时,确定该疑似广告节点为非广告节点,并对该非广告节点对应的网页素材资源进行渲染。
[0094]在步骤204中,若元素节点符合节点CSS特征且符合节点内容特征,则停止对该元素节点对应网页素材资源的渲染操作。
[0095]当检测到元素节点既符合节点CSS特征,又符合节点内容特征时,网页浏览器内核确定该元素节点为广告节点,并停止对该广告节点对应的网页素材资源进行渲染,使得网页中显示的网页素材资源中不包含广告,避免网页中广告对用户浏览网页时造成的影响。
[0096]需要说明的是,网页浏览器内核也可以在元素节点符合节点CSS特征时,确定该元素节点为广告节点,并停止对该元素节点对应网页素材资源的渲染操作;网页浏览器内核还可以在元素节点符合节点内容特征时,确定该元素节点为广告节点,并停止对该元素节点对应网页素材资源的渲染操作。本实施例仅以元素节点同时符合节点CSS特征和节点内容特征时确定该元素节点为广告节点为例进行说明,并不对本公开构成限定。
[0097]综上所述,本实施例提供的网页渲染方法,通过在渲染网页时,对网页源代码中各个元素节点的节点特征进行分析,将符合预设节点特征的元素节点确定为广告节点,并停止对广告节点的渲染;解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
[0098]本实施例中,网页浏览器内核通过对元素节点的节点CSS特征和节点内容特征进行检测,从而确定元素节点是否为广告节点,并对广告节点进行过滤,起到网页广告过滤的效果,相较于根据广告资源列表进行广告的过滤,显著降低了广告过滤的难度和成本;并且,网页浏览器内核在进行网页渲染时无需对广告资源对应的元素节点进行渲染,能够提升网页浏览器的渲染速度和性能。
[0099]本实施例中,通过检测元素节点是否符合节点CSS特征以及节点内容特征,确定元素节点是否为广告节点,避免了错误过滤非广告节点,提高广告节点过滤的准确性。
[0100]基于图2A所示实施例提供的网页渲染方法,网页浏览器内核可以通过检测元素节点的posit1n属性、top属性、bottom属性以及width属性来确定元素节点是否符合节点CSS特征,示意性的,如图2B所示,上述步骤202可以包括如下三种可能的实施方式。
[Ο?Ο? ] 在步骤202Α中,获取元素节点对应的posit1n属性;检测posit1n属性是否指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当posit1n属性指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定该元素节点符合节点CSS特征。
[0102]为了使用户在浏览网页的过程中,不论如何滚动网页页面,均能够在浏览器显示区域内查看到网页中的广告,广告节点对应的CSS的posit1n属性预先进行过相应设置。比如,广告节点对应的CSS中,posit1n属性的属性值被设置为fixed或absolute,使得广告节点对应的网页素材资源(广告)在浏览器显示区域中的显示位置保持不变。
[0103]因此,网页浏览器内核可以获取网页源代码中各个元素节点对应的posit1n属性,并检测posit1n属性是否指示元素节点对应的网页素材资源在待渲染网页中的显示位置保持不变。若元素节点对应的posit1n属性指示网页素材资源在待渲染网页中的显示位置保持不变,该元素节点即符合(广告)节点CSS特征,反之该元素节点不符合(广告)节点CSS特征。
[0104]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,网页浏览器内核调用011601^08;[1:;[0113丨716方法,检测元素节点对应口08;[1:;[011属性(比如元素节点中di V的posit1n属性)的属性值是否为fixed或absolute,并在检测到元素节点对应posit1n属性的属性值为fixed或absolute时,确定该元素节点符合节点CSS特征。
[0105]在步骤202B中,获取元素节点对应的top属性以及bottom属性;检测top属性以及bottom属性是否指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端;当top属性以及bottom属性指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端时,确定该元素节点符合节点CSS特征。
[0106]为了在用户浏览网页时引起用户的关注,网页中的广告通常显示在网页的顶端或底端,这可以通过设置元素节点对应CSS的top属性或bottom属性来实现。
[0107]因此,网页浏览器内核可以获取网页源代码中各个元素节点对应的top属性以及bottom属性,并检测top属性以及bottom属性的属性值是否指示网页素材资源位于待清染网页的顶端或底端,若top属性以及bottom属性的属性值指示网页素材资源位于待渲染网页的顶端或底端,该元素节点即符合(广告)节点CSS特征,反之该元素节点不符合(广告)节点CSS特征。
[0108]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,网页浏览器内核调用checkTopStyle方法,检测元素节点对应top属性(比如元素节点中div的top属性)是否指示元素节点对应的网页素材资源位于网页顶端;网页浏览器内核调用checkBottomStyle方法,检测元素节点对应bottom属性是否指示元素节点对应的网页素材资源位于网页底端。
[0?09]在步骤202C中,获取元素节点对应的width属性;检测width属性是否指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当width属性指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定该元素节点符合节点CSS特征。
[0110]网页中的广告通常具有页面适应性,即网页中的广告能够根据浏览器显示区域的大小,改变自身的显示尺寸,这可以通过设置元素节点对应CSS的width属性来实现。
[0111]因此,网页浏览器内核可以获取网页源代码中各个元素节点对应的width属性,并在该width属性指示网页素材资源的宽度与浏览器显示区域的宽度相同时,确定该元素节点符合(广告)节点CSS特性,反之确定该元素节点不符合(广告)节点CSS特征。
[0112]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,网页浏览器内核调用checkBottomStyle方法,检测元素节点对应width属性(比如元素节点中div的width属性)是否指示对应的网页素材资源占显示区域的宽度百分比(percent)为100,若元素节点对应width属性指示对应的网页素材资源占显示区域的宽度百分比为100,确定该元素节点符合(广告)节点CSS特性,反之确定该元素节点不符合(广告)节点CSS特征。
[0113]需要说明的一点是,网页浏览器内核可以根据上述三种实施方式中的任意一种来检测元素节点是否符合节点CSS特性;为了提高广告识别的准确性,网页浏览器内核也可以根据上述三种实施方式中的任意两种或三种的组合来检测元素节点是否符合节点CSS特性,即元素节点的bottom属性、top属性/bottom属性和width属性中的至少两个属性满足上述属性值要求时,该元素节点才算符合节点CSS特性。
[0114]需要说明的另一点是,本实施例仅以上述三种可能的实施方式进行示意性说明,在其他可能的实施方式中,网页浏览器内核还可以根据其他CSS特征来确定元素节点是否为广告节点,本公开实施例并不对此构成限定。
[0115]基于图2A所示实施例提供的网页渲染方法,网页浏览器内核可以通过检测元素节点对应的文字显示内容中是否包含预定关键词,和/或,检测元素节点中是否包含用于显示关闭组件的代码来确定元素节点是否符合(广告)节点内容特征。示意性的,如图2C所示,上述步骤203可以包括如下两种可能的实施方式。
[0116]在步骤203A中,检测元素节点对应的文字显示内容中是否包含预定关键词;当元素节点对应的文字显示内容中包含预定关键词时,确定该元素节点符合节点内容特征。
[0117]网页中显示的广告中通常包含广告词,因此,网页浏览器内核可以进一步检测元素节点中是否包含预定关键词,该预定关键词可以为诸如下载、更新、体验、推广等广告词。若检测到元素节点中包含预定关键词时,则确定该元素节点符合(广告)节点内容特征。
[0118]比如,网页浏览器内核获取到元素节点中包含如下内容“〈a class = ,,download,,href = //http://app.example.com/download/app.apk//>i_Pl^^〈/a>,,,艮Pi亥元素节(寸应的文字显示内容为“立即下载”,当预定关键词中包含下载时,即确定该元素节点符合广告节点内容特征。
[0119]在步骤203B中,检测元素节点中是否包含用于显示关闭组件的代码;当元素节点中包含用于显示关闭组件的代码时,确定该元素节点符合节点内容特征。
[0120]按照规定,网页中广告的相应位置需要配备有关闭按钮,因此,网页浏览器可以进一步检测元素节点中是否包含用于显示关闭组件的代码。若检测到元素节点中包含用于显示关闭组件的代码,则确定该元素节点符合(广告)节点内容特征。
[0121]作为一种可能的实施方式,网页浏览器内核可以检测元素节点中是否包含标签类型为close的标签,若元素节点中包含标签类型为close的标签,则确定该元素节点中包含用于显示关闭组件的代码。
[0122]比如,网页浏览器内核获取到元素节点中包含如下内容“〈a class = ,,close,,href= 〃#〃>〈/a>”,即元素节点中包含标签类型为close的标签,确定该元素节点中包含用于显示关闭组件的代码。
[0123]需要说明的是,网页浏览器内核可以根据上述两种实施方式中的任意一种来检测元素节点是否符合节点内容特性;为了提高广告识别的准确性,网页浏览器内核也可以同时根据上述两种实施方式来检测元素节点是否符合节点内容特性,本实施例并不对此进行限定。
[0124]基于图2A所示实施例提供的网页渲染方法,当确定元素节点为广告节点时,网页浏览器内核可以通过下述方法中的任意一种,停止对广告节点对应网页素材资源的渲染操作。示意性的,如图2D所示,上述步骤204可以包括如下两种可能的实施方式。
[0125]在步骤204A中,若元素节点符合预设节点特征,则将DOMtree中,元素节点对应的DOM node的display属性设置为none,D0M tree由网页源代码解析构建得到;将DOM node对应的RenderObject从Render tree中删除,Render tree根据DOM tree生成,Render tree中的RenderObject与DOM tree 中的DOM node对应。
[0126]网页浏览器内核根据待渲染网页的网页源代码渲染网页时,首先对网页源代码进行解析并构建DOM tree,进而根据DOM tree和网页源代码中的CSS生成Render tree。其中,网页源代码中的元素节点对应DOM tree中的DOM node ,Render tree中的RenderObject与DOM tree中的DOM node对应,且RenderObject用于控制对应DOM node的渲染操作。
[0127]当检测到元素节点符合预设节点特征时,网页浏览器内核将该元素节点在DOMtree中对应的DOM node的display属性设置为none,使得该元素节点对应的网页素材资源不在待渲染网页中进行显示。同时,为了进一步提高网页浏览器内核的渲染性能,网页浏览器内核通过调用detach方法,将Render tree中该元素节点对应的RenderObject删除,使得网页浏览器内核不再需要根据该元素节点对应的RenderObject进行网页素材资源的渲染。
[0128]在步骤204B中,若元素节点符合预设节点特征,则根据网页源代码重新解析构建DOM tree,并删除DOM tree中元素节点对应的DOM node;根据重新解析构建后的DOM tree生成Render tree。
[0129]在另一种可能的实施方式中,当检测到元素节点符合预设节点特征,网页浏览器内核确定存在广告节点,并根据网页源代码重新解析并构建DOM tree。在构建DOM tree的过程中,网页浏览器内核将该广告节点对应的DOM node删除。由于Render tree中的RenderObject与DOM tree中的DOM node对应,当DOM tree中不存在广告节点对应的DOMnode时,生成的Render tree也不再包含广告节点对应的RenderObject,从而避免了对广告节点对应的网页素材资源进行渲染,起到广告过滤的效果。
[0130]下述为本公开装置实施例,可以用于执行本公开方法实施例。对于本公开装置实施例中未披露的细节,请参照本公开方法实施例。
[0131]图3是根据一示例性实施例示出的网页渲染装置的结构方框图,该网页渲染装置可以通过软件、硬件或者两者的结合实现成为安装有网页浏览器的电子设备的部分或者全部。该网页渲染装置可以包括:
[0132]获取模块310,被配置为获取待渲染网页的网页源代码。
[0133]检测模块320,被配置为检测网页源代码中的元素节点是否符合预设节点特征;元素节点与待渲染网页中的网页素材资源对应,节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果。
[0134]预设节点特征是通过对网页中广告的显示特征进行分析得到的。该预设节点特征可以包括元素节点的节点CSS特征和节点内容特征中的至少一种,其中,CSS特征用于指示元素节点对应的网页素材资源的显示样式,节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0135]停止模块330,被配置为当元素节点符合预设节点特征时,停止对元素节点对应网页素材资源的渲染操作。
[0136]对于符合预设节点特征的元素节点,停止模块330将其确定为广告节点,并停止对该广告节点对应的素材资源进行渲染,从而起到广告拦截的效果。
[0137]比如,当元素节点符合节点CSS特征时,确定该元素节点为广告节点;又比如,当元素节点符合节点内容特征,确定该元素节点为广告节点;再比如,当元素节点符合节点CSS特征以及节点内容特征时,确定该元素节点为广告节点。
[0138]相较于相关技术中根据广告资源列表进行广告的过滤,本实施例提供的网页渲染装置中,由于网页中广告的显示特征较为明显且变化较小,预设节点特征不需要进行频繁的更新,显著降低了广告过滤的难度和成本;并且,网页浏览器在进行网页渲染时无需对广告资源对应的元素节点进行渲染,能够提升网页浏览器的渲染速度和性能。
[0139]综上所述,本实施例提供的网页渲染装置,通过在渲染网页时,对网页源代码中各个元素节点的节点特征进行分析,将符合预设节点特征的元素节点确定为广告节点,并停止对广告节点的渲染;解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
[0140]图4是根据另一示例性实施例示出的网页渲染装置的结构方框图,该网页渲染装置可以通过软件、硬件或者两者的结合实现成为安装有网页浏览器的电子设备的部分或者全部。该网页渲染装置可以包括:
[0141]获取模块410,被配置为获取待渲染网页的网页源代码。
[0142]用户使用电子设备中的网页浏览器浏览网页时,网页浏览器从网页服务器处获取该网页的网页源代码,比如,该网页源代码可以是网页的HTML代码。
[0143]通常情况下,网页中包含大量网页素材资源,比如图片资源、文字资源和视频资源等等,各个网页素材资源分别对应网页源代码中不同的元素节点。网页浏览器内核进行网页页面渲染时,即对各个网页素材资源对应的元素节点进行渲染。
[0144]检测模块420,被配置为检测网页源代码中的元素节点是否符合预设节点特征;元素节点与所述待渲染网页中的网页素材资源对应,节点特征指示元素节点对应的网页素材资源在待渲染网页中的显示效果。
[0145]停止模块430,被配置为当元素节点符合预设节点特征时,停止对元素节点对应网页素材资源的渲染操作。
[0146]在一个可选的实施例中,检测模块420,包括:
[0147]样式检测子模块421,被配置为检测元素节点是否符合节点CSS特征;节点CSS特征用于指示元素节点对应的网页素材资源的显示样式。
[0148]网页中显示的广告存在一些明显的显示样式特征,以网页中的悬浮条广告为例,不论用户如何滚动网页页面,悬浮条广告在网页浏览器界面中显示的位置固定不变;悬浮条广告通常位于网页的顶端或底端;悬浮条广告的宽度通常与浏览器界面的显示宽度相同。
[0149]上述显示样式均通过广告节点对应的CSS实现,因此,网页浏览器内核在渲染阶段可以对各个元素节点的CSS进行分析,确定元素节点是否符合广告节点的节点CSS特征,从而进一步识别出元素节点中包含的广告节点。其中,元素节点的CSS可以采用外联式、嵌入式或内联式,本实施例并不对此进行限定。
[0150]在一个可选的实施例中,样式检测子模块421,包括:第一样式检测子模块42Ia和/或第二样式检测子模块421b和/或第三样式检测子模块421c。
[0151]第一样式检测子模块421a,被配置为获取元素节点对应的posit1n属性;检测posit1n属性是否指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当posit1n属性指示元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定元素节点符合节点CSS特征。
[0152]为了使用户在浏览网页的过程中,不论如何滚动网页页面,均能够在浏览器显示区域内查看到网页中的广告,广告节点对应的CSS的posit1n属性预先进行过相应设置。比如,广告节点对应的CSS中,posit1n属性的属性值被设置为fixed或absolute,使得广告节点对应的网页素材资源(广告)在浏览器显示区域中的显示位置保持不变。
[0153]因此,第一样式检测子模块421a可以获取网页源代码中各个元素节点对应的posit1n属性,并检测posit1n属性是否指示元素节点对应的网页素材资源在待清染网页中的显示位置保持不变。若元素节点对应的posit1n属性指示网页素材资源在待渲染网页中的显示位置保持不变,该元素节点即符合(广告)节点CSS特征,反之该元素节点不符合(广告)节点CSS特征。
[0154]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,第一样式检测子模块421a调用checkPosit1nSty Ie方法,检测元素节点对应posit1n属性(比如元素节点中div的posit1n属性)的属性值是否为fixed或absolute,并在检测到元素节点对应pos it 1n属性的属性值为fixed或absolute时,确定该元素节点符合节点CSS特征。
[0155]第二样式检测子模块421b,被配置为获取元素节点对应的top属性以及bottom属性;检测top属性以及bottom属性是否指示元素节点对应的网页素材资源位于待渲染网页的顶端或底端;当top属性以及bottom属性指示元素节点对应的网页素材资源位于待清染网页的顶端或底端时,确定元素节点符合节点CSS特征。
[0156]为了在用户浏览网页时引起用户的关注,网页中的广告通常显示在网页的顶端或底端,这可以通过设置元素节点对应CSS的top属性或bottom属性来实现。
[0157]因此,第二样式检测子模块421b可以获取网页源代码中各个元素节点对应的top属性以及bottom属性,并检测top属性以及bottom属性的属性值是否指示网页素材资源位于待渲染网页的顶端或底端,若top属性以及bottom属性的属性值指示网页素材资源位于待清染网页的顶端或底端,该元素节点即符合(广告)节点CSS特征,反之该元素节点不符合(广告)节点CSS特征。
[0158]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,第二样式检测子模块421b调用checkTopStyle方法,检测元素节点对应top属性(比如元素节点中div的top属性)是否指示元素节点对应的网页素材资源位于网页顶端;网页浏览器内核调用checkBottomStyle方法,检测元素节点对应bottom属性是否指示元素节点对应的网页素材资源位于网页底端。
[0159]第三样式检测子模块421c,被配置为获取元素节点对应的width属性;检测width属性是否指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当width属性指示元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定元素节点符合节点CSS特征。
[0160]网页中的广告通常具有页面适应性,即网页中的广告能够根据浏览器显示区域的大小,改变自身的显示尺寸,这可以通过设置元素节点对应CSS的width属性来实现。
[0161]因此,第三样式检测子模块421c可以获取网页源代码中各个元素节点对应的width属性,并在该width属性指示网页素材资源的宽度与浏览器显示区域的宽度相同时,确定该元素节点符合(广告)节点CSS特性,反之确定该元素节点不符合(广告)节点CSS特征。
[0162]作为一种可能的实施方式,对于待渲染网页对应网页源代码中的各个元素节点,第三样式检测子模块421c调用checkBottomStyle方法,检测元素节点对应width属性(比如元素节点中div的width属性)是否指示对应的网页素材资源占显示区域的宽度百分比(percent)为100,若元素节点对应width属性指示对应的网页素材资源占显示区域的宽度百分比为100,确定该元素节点符合(广告)节点CSS特性,反之确定该元素节点不符合(广告)节点CSS特征。
[0163]需要说明的一点是,电子设备可以根据上述三种样式检测子模块中的任意一种来检测元素节点是否符合节点CSS特性;为了提高广告识别的准确性,网页浏览器内核也可以根据上述三种样式检测子模块中的任意两种或三种的组合来检测元素节点是否符合节点CSS特性,即元素节点的bottom属性、top属性/bottom属性和width属性中的至少两个属性满足上述属性值要求时,该元素节点才算符合节点CSS特性。
[0164]在一个可选的实施例中,检测模块420,还包括:
[0165]内容检测子模块422,被配置为检测元素节点是否符合节点内容特征;节点内容特征用于指示元素节点对应的网页素材资源中包含的显示内容。
[0166]仅根据元素节点的节点CSS特征来判断其是否为广告节点可能会导致错误过滤。比如,部分社交网页上存在工具栏,不论用户如何滚动页面,该工具栏均显示在网页的固定位置,其对应的元素节点符合广告节点的节点CSS特征,若对该工具栏进行过滤会导致用户无法使用工具栏。
[0167]通过对网页中的广告进行分析发现,网页上的广告除了具有明显的CSS特征外,还具有明显的显示内容特征,比如,广告中会出现广告关键词以及关闭广告的按钮。
[0168]因此,为了提高过滤的准确性,当检测到网页源代码中的元素节点符合节点CSS特征时,将该元素节点确定为疑似广告节点,并通过内容检测子模块422进一步检测该疑似广告节点是否符合节点内容特征。当该疑似广告节点符合节点内容特征时,确定该疑似广告节点为广告节点;当该疑似广告节点不符合节点内容特征时,确定该疑似广告节点为非广告节点,并对该非广告节点对应的网页素材资源进行渲染。
[0169]在一个可选的实施例中,内容检测子模块422,包括:第一检测子模块422a和/或第二检测子模块422b。
[0170]第一检测子模块422a,被配置为检测元素节点对应的文字显示内容中是否包含预定关键词;当元素节点对应的文字显示内容中包含预定关键词时,确定元素节点符合节点内容特征。
[0171]网页中显示的广告中通常包含广告词,因此,第一检测子模块422a可以进一步检测元素节点中是否包含预定关键词,该预定关键词可以为诸如下载、更新、体验、推广等广告词。若检测到元素节点中包含预定关键词时,则确定该元素节点符合(广告)节点内容特征。
[0172]比如,第一检测子模块422a获取到元素节点中包含如下内容“〈aclass = "download〃href = 〃http: //app.example.com/download/app.apk〃>i即下载</a>,,,即i亥元素节点对应的文字显示内容为“立即下载”,当预定关键词中包含下载时,即确定该元素节点符合广告节点内容特征。
[0173]第二检测子模块422b,被配置为检测元素节点中是否包含用于显示关闭组件的代码;当元素节点中包含用于显示关闭组件的代码时,确定元素节点符合节点内容特征。
[0174]按照规定,网页中广告的相应位置需要配备有关闭按钮,因此,第二检测子模块422b可以进一步检测元素节点中是否包含用于显示关闭组件的代码。若检测到元素节点中包含用于显示关闭组件的代码,则确定该元素节点符合(广告)节点内容特征。
[0175]作为一种可能的实施方式,第二检测子模块422b可以检测元素节点中是否包含标签类型为close的标签,若元素节点中包含标签类型为close的标签,则确定该元素节点中包含用于显示关闭组件的代码。
[0176]比如,第二检测子模块422b获取到元素节点中包含如下内容“〈aclass = "close"href = "#">〈/a>”,即元素节点中包含标签类型为close的标签,确定该元素节点中包含用于显示关闭组件的代码。
[0177]需要说明的是,网页渲染装置可以根据第一检测子模块422a和第二检测子模块422b中的任意一种来检测元素节点是否符合节点内容特性;为了提高广告识别的准确性,网页渲染装置也可以同时根据第一检测子模块422a和第二检测子模块422b来检测元素节点是否符合节点内容特性,本实施例并不对此进行限定。
[0178]在一个可选的实施例中,停止模块430,包括:第一停止子模块431和/或第二停止子模块432。
[0179]第一停止子模块431,被配置为若元素节点符合预设节点特征,则将DOMtree中,所述元素节点对应的DOM node的display属性设置为none,DOM tree由网页源代码解析构建得到;将DOM node对应的RenderObject从清染树Render tree中删除,Render tree根据DOM tree生成,Render tree中的RenderObject与DOM tree中的DOM node对应。
[0180]网页渲染装置根据待渲染网页的网页源代码渲染网页时,首先对网页源代码进行解析并构建DOM tree,进而根据DOM tree和网页源代码中的CSS生成Render tree。其中,网页源代码中的元素节点对应DOM tree中的DOM node ,Render tree中的RenderObject与DOMtree中的DOM node对应,且RenderObject用于控制对应DOM node的清染操作。
[0181]当检测到元素节点符合预设节点特征时,第一停止子模块431将该元素节点在DOMtree中对应的DOM node的display属性设置为none,使得该元素节点对应的网页素材资源不在待渲染网页中进行显示。同时,为了进一步提高网页浏览器内核的渲染性能,第一停止子模块431将Render tree中该元素节点对应的RenderObject删除,使得网页浏览器内核不再需要根据该元素节点对应的RenderObject进行网页素材资源的渲染。
[0182]第二停止子模块432,被配置为若元素节点符合预设节点特征,则根据网页源代码重新解析构建DOM tree,并删除DOM tree中该元素节点对应的DOM node;根据重新解析构建后的DOM tree生成Render tree;其中,Render tree用于对网页素材资源进行清染操作。
[0183]在另一种可能的实施方式中,当检测到元素节点符合预设节点特征,第二停止子模块432确定存在广告节点,并根据网页源代码重新解析并构建DOM tree。在构建DOM tree的过程中,第二停止子模块432将该广告节点对应的DOM node删除。由于Render tree中的RenderObject与DOM tree中的DOM node对应,当DOM tree中不存在广告节点对应的DOMnode时,生成的Render tree也不再包含广告节点对应的RenderObject,从而避免了对广告节点对应的网页素材资源进行渲染,起到广告过滤的效果。
[0184]综上所述,本实施例提供的网页渲染装置,通过在渲染网页时,对网页源代码中各个元素节点的节点特征进行分析,将符合预设节点特征的元素节点确定为广告节点,并停止对广告节点的渲染;解决了相关技术中广告过滤依赖广告资源列表,若广告资源列表未及时更新,广告过滤的效果将受到影响的问题;达到了在不依赖广告资源列表的前提下,根据广告节点的节点特征识别出待渲染网页中包含的广告,进而停止渲染网页中的广告,降低了广告过滤的难度,提升了广告过滤的效率。
[0185]本实施例中,网页浏览器内核通过对元素节点的节点CSS特征和节点内容特征进行检测,从而确定元素节点是否为广告节点,并对广告节点进行过滤,起到网页广告过滤的效果,相较于根据广告资源列表进行广告的过滤,显著降低了广告过滤的难度和成本;并且,网页浏览器内核在进行网页渲染时无需对广告资源对应的元素节点进行渲染,能够提升网页浏览器的渲染速度和性能。
[0186]本实施例中,通过检测元素节点是否符合节点CSS特征以及节点内容特征,确定元素节点是否为广告节点,避免了错误过滤非广告节点,提高广告节点过滤的准确性。
[0187]图5是根据一示例性实施例示出的网页渲染装置500的框图。例如,装置500可以是安装有网页浏览器的电子设备。
[0188]参照图5,装置500可以包括以下一个或多个组件:处理组件502,存储器504,电源组件506,多媒体组件508,音频组件510,输入/输出(I/O)的接口512,传感器组件514,以及通信组件516。
[0189]处理组件502通常控制装置500的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件502可以包括一个或多个处理器520来执行指令,以完成上述的方法的全部或部分步骤。此外,处理组件502可以包括一个或多个模块,便于处理组件502和其他组件之间的交互。例如,处理组件502可以包括多媒体模块,以方便多媒体组件508和处理组件502之间的交互。
[0190]存储器504被配置为存储各种类型的数据以支持在装置500的操作。这些数据的示例包括用于在装置500上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。存储器504可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
[0191]电源组件506为装置500的各种组件提供电力。电源组件506可以包括电源管理系统,一个或多个电源,及其他与为装置500生成、管理和分配电力相关联的组件。
[0192]多媒体组件508包括在所述装置500和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件508包括一个前置摄像头和/或后置摄像头。当装置500处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
[0193]音频组件510被配置为输出和/或输入音频信号。例如,音频组件510包括一个麦克风(MIC),当装置500处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器504或经由通信组件516发送。在一些实施例中,音频组件510还包括一个扬声器,用于输出音频信号。
[0194]I/O接口512为处理组件502和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
[0195]传感器组件514包括一个或多个传感器,用于为装置500提供各个方面的状态评估。例如,传感器组件514可以检测到装置500的打开/关闭状态,组件的相对定位,例如所述组件为装置500的显示器和小键盘,传感器组件514还可以检测装置500或装置500—个组件的位置改变,用户与装置500接触的存在或不存在,装置500方位或加速/减速和装置500的温度变化。传感器组件514可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件514还可以包括光传感器,如CMOS或C⑶图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件514还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
[0196]通信组件516被配置为便于装置500和其他设备之间有线或无线方式的通信。装置500可以接入基于通信标准的无线网络,如WiFi,2G或3G,或它们的组合。在一个示例性实施例中,通信组件516经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,所述通信组件516还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
[0197]在示例性实施例中,装置500可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述方法。
[0198]在示例性实施例中,还提供了一种包括指令的非临时性计算机可读存储介质,例如包括指令的存储器504,上述指令可由装置500的处理器520执行以完成上述方法。例如,所述非临时性计算机可读存储介质可以是R0M、随机存取存储器(RAM)、CD-R0M、磁带、软盘和光数据存储设备等。
[0199]一种非临时性计算机可读存储介质,当所述存储介质中的指令由装置500的处理器执行时,使得装置500能够执行应用于安装有网页浏览器的电子设备中的网页渲染方法。
[0200]本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本公开的真正范围和精神由下面的权利要求指出。
[0201]应当理解的是,本公开并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。
【主权项】
1.一种网页渲染方法,其特征在于,所述方法包括: 获取待渲染网页的网页源代码; 检测所述网页源代码中的元素节点是否符合预设节点特征;所述元素节点与所述待渲染网页中的网页素材资源对应,所述预设节点特征指示所述元素节点对应的网页素材资源在所述待渲染网页中的显示效果; 当所述元素节点符合所述预设节点特征时,停止对所述元素节点对应网页素材资源的渲染操作。2.根据权利要求1所述的方法,其特征在于,所述检测所述网页源代码中的元素节点是否符合预设节点特征,包括: 检测所述元素节点是否符合节点层叠样式表CSS特征;所述节点CSS特征用于指示所述元素节点对应的网页素材资源的显示样式。3.根据权利要求2所述的方法,其特征在于,所述检测所述元素节点是否符合节点CSS特征,包括: 获取所述元素节点对应的位置posit1n属性;检测所述posit 1n属性是否指示所述元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当所述posit1n属性指示所述元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定所述元素节点符合所述节点CSS特征; 和/或, 获取所述元素节点对应的顶部top属性以及底部bottom属性;检测所述top属性以及所述bottom属性是否指示所述元素节点对应的网页素材资源位于所述待渲染网页的顶端或底端;当所述top属性以及所述bottom属性指示所述元素节点对应的网页素材资源位于所述待清染网页的顶端或底端时,确定所述元素节点符合所述节点CSS特征; 和/或, 获取所述元素节点对应的宽度width属性;检测所述width属性是否指示所述元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当所述width属性指示所述元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定所述元素节点符合所述节点CSS特征。4.根据权利要求1所述的方法,其特征在于,所述检测所述网页源代码中的元素节点是否符合预设节点特征,还包括: 检测所述元素节点是否符合节点内容特征;所述节点内容特征用于指示所述元素节点对应的网页素材资源中包含的显示内容。5.根据权利要求4所述的方法,其特征在于,所述检测所述元素节点是否符合节点内容特征,包括: 检测所述元素节点对应的文字显示内容中是否包含预定关键词;当所述元素节点对应的文字显示内容中包含预定关键词时,确定所述元素节点符合所述节点内容特征; 和/或, 检测所述元素节点中是否包含用于显示关闭组件的代码;当所述元素节点中包含用于显示关闭组件的代码时,确定所述元素节点符合所述节点内容特征。6.根据权利要求1至5任一所述的方法,其特征在于,所述当所述元素节点符合所述预设节点特征时,停止对所述元素节点对应网页素材资源的渲染操作,包括: 若所述元素节点符合所述预设节点特征,则将文档对象化模型树DOM tree中,所述元素节点对应的文档对象化模型节点DOM node的显示display属性设置为none,所述DOMtree由所述网页源代码解析构建得到;将所述DOM node对应的清染对象RenderObject从清染树Render tree中删除,所述Render tree根据所述DOM tree生成,所述Render tree中的RenderObject与所述DOM tree中的DOM node对应; 或, 若所述元素节点符合所述预设节点特征,则根据所述网页源代码重新解析构建DOMtree,并删除所述DOM tree中所述元素节点对应的DOM node;根据重新解析构建后的DOMtree生成Render tree ; 其中,所述Render tree用于对网页素材资源进行渲染操作。7.—种网页渲染装置,其特征在于,所述装置包括: 获取模块,被配置为获取待渲染网页的网页源代码; 检测模块,被配置为检测所述网页源代码中的元素节点是否符合预设节点特征;所述元素节点与所述待渲染网页中的网页素材资源对应,所述预设节点特征指示所述元素节点对应的网页素材资源在所述待渲染网页中的显示效果;; 停止模块,被配置为当所述元素节点符合所述预设节点特征时,停止对所述元素节点对应网页素材资源的渲染操作。8.根据权利要求7所述的装置,其特征在于,所述检测模块,包括: 样式检测子模块,被配置为检测所述元素节点是否符合节点层叠样式表CSS特征;所述节点CSS特征用于指示所述元素节点对应的网页素材资源的显示样式。9.根据权利要求8所述的装置,其特征在于,所述样式检测子模块,包括: 第一样式检测子模块,被配置为获取所述元素节点对应的位置posit1n属性;检测所述posit1n属性是否指示所述元素节点对应的网页素材资源在显示区域中的显示位置保持不变;当所述posit1n属性指示所述元素节点对应的网页素材资源在显示区域中的显示位置保持不变时,确定所述元素节点符合所述节点CSS特征; 和/或, 第二样式检测子模块,被配置为获取所述元素节点对应的顶部top属性以及底部bottom属性;检测所述top属性以及所述bottom属性是否指示所述元素节点对应的网页素材资源位于所述待清染网页的顶端或底端;当所述top属性以及所述bottom属性指示所述元素节点对应的网页素材资源位于所述待渲染网页的顶端或底端时,确定所述元素节点符合所述节点CSS特征; 和/或, 第三样式检测子模块,被配置为获取所述元素节点对应的宽度Width属性;检测所述width属性是否指示所述元素节点对应的网页素材资源的宽度与显示区域的宽度相同;当所述width属性指示所述元素节点对应的网页素材资源的宽度与显示区域的宽度相同时,确定所述元素节点符合所述节点CSS特征。10.根据权利要求7所述的装置,其特征在于,所述检测模块,还包括: 内容检测子模块,被配置为检测所述元素节点是否符合节点内容特征;所述节点内容特征用于指示所述元素节点对应的网页素材资源中包含的显示内容。11.根据权利要求10所述的装置,其特征在于,所述内容检测子模块,还包括: 第一检测子模块,被配置为检测所述元素节点对应的文字显示内容中是否包含预定关键词;当所述元素节点对应的文字显示内容中包含预定关键词时,确定所述元素节点符合所述节点内容特征; 和/或, 第二检测子模块,被配置为检测所述元素节点中是否包含用于显示关闭组件的代码;当所述元素节点中包含用于显示关闭组件的代码时,确定所述元素节点符合所述节点内容特征。12.根据权利要求7至11任一所述的装置,其特征在于,所述停止模块,包括: 第一停止子模块,被配置为若所述元素节点符合所述预设节点特征,则将文档对象化模型树DOM tree中,所述元素节点对应的文档对象化模型节点DOM node的显示display属性设置为none,所述DOM tree由所述网页源代码解析构建得到;将所述DOM node对应的渲染对象RenderObject从清染树Render tree中删除,所述Render tree根据所述DOM tree生成,所述Render tree中的RenderObject与所述DOM tree中的DOM node对应; 或, 第二停止子模块,被配置为若所述元素节点符合所述预设节点特征,则根据所述网页源代码重新解析构建DOM tree,并删除所述DOM tree中所述元素节点对应的DOM node;根据重新解析构建后的DOM tree生成Render tree; 其中,所述Render tree用于对网页素材资源进行渲染操作。13.—种网页渲染装置,其特征在于,包括: 处理器; 用于存储所述处理器的可执行指令的存储器; 其中,所述处理器被配置为: 获取待渲染网页的网页源代码; 检测所述网页源代码中的元素节点是否符合预设节点特征;所述元素节点与所述待渲染网页中的网页素材资源对应,所述预设节点特征指示所述元素节点对应的网页素材资源在所述待渲染网页中的显示效果; 当所述元素节点符合所述预设节点特征时,停止对所述元素节点对应网页素材资源的渲染操作。
【文档编号】G06F17/30GK105956026SQ201610258391
【公开日】2016年9月21日
【申请日】2016年4月22日
【发明人】范金松, 王百超
【申请人】北京小米移动软件有限公司
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1