CN105786924B - 网页夜间模式处理方法、装置及移动终端 - Google Patents
网页夜间模式处理方法、装置及移动终端 Download PDFInfo
- Publication number
- CN105786924B CN105786924B CN201410830793.XA CN201410830793A CN105786924B CN 105786924 B CN105786924 B CN 105786924B CN 201410830793 A CN201410830793 A CN 201410830793A CN 105786924 B CN105786924 B CN 105786924B
- Authority
- CN
- China
- Prior art keywords
- night mode
- style
- css
- css style
- node
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/14—Tree-structured documents
- G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/103—Formatting, i.e. changing of presentation of documents
- G06F40/117—Tagging; Marking up; Designating a block; Setting of attributes
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/151—Transformation
- G06F40/154—Tree transformation for tree-structured or markup documents, e.g. XSLT, XSL-FO or stylesheets
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/197—Version control
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明公开了一种网页的夜间模式处理方法、装置及移动终端。该方法包括:浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中;以及浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示。通过上述方式,本发明能够保持原网页的布局的情况下实现夜间模式效果,改善用户的浏览体验效果。
Description
技术领域
本发明涉及移动通信技术领域,特别是涉及一种网页夜间模式处理方法、装置及移动终端。
背景技术
为了使得用户在晚上等光线比较弱的场景下更好地在移动终端上使用浏览器来进行网页浏览,现在大部分移动终端的浏览器都实现了夜间模式功能。夜间模式功能的实现主要包括两种方式:第一种现有方式是将整个浏览器界面(包括网页内容)统一降低明度,比如百度手机浏览器等;第二种现有方式是将浏览器界面和网页内容分开处理,浏览器界面使用夜间模式皮肤方案,同时将网页的背景色替换成低明度的颜色并将图片降低明度。
目前,在基于封闭式的操作系统的终端上,例如iOS操作系统,由于其封闭性,不允许第三方浏览器使用自有内核(即第三方浏览器的内核),只能使用其提供的特定控件来实现,例如,UIWebView、WKWebView,而这种控件只能提供有限的接口供外部调用,第三方浏览器无法直接修改内核对网页的排版及渲染流程。这使得目前在基于上述封闭式操作系统中使用第三方浏览器实现夜间模式时,只能通过上述第一种方式,在网页上覆盖一层蒙版来实现夜间模式,这使得终端屏幕亮度降低,显示效果差,从而大大降低了网页内容的可读性,十分不利于用户在光线比较弱的环境下进行网页浏览,浏览效果因此变差。
发明内容
本发明主要解决的技术问题是提供一种网页的夜间模式处理方法及装置,能够保持原网页的布局的情况下实现夜间模式效果,改善显示效果,提高用户的浏览体验效果。
为解决上述技术问题,本发明采用的一个技术方案是:提供一种网页的夜间模式处理方法,所述方法包括:浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中;以及当浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示。
其中,所述浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中的步骤之前,所述方法还包括:通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类;所述浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中的步骤具体为:所述浏览器在加载网页时,通过所述NSURLProtocol的子类将所述夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中。
其中,所述当浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示的步骤包括:
所述浏览器解析所述网页的主文档生成对应的Dom Tree;所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示。
其中,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:当所述夜间模式的CSS样式为应用于所述Dom Tree中的第一设定节点的第一类夜间模式的CSS样式时,将所述第一设定节点的CSS样式设置为所述第一类夜间模式的CSS样式指定的背景色、边框颜色或文本颜色;其中,所述第一设定节点为在夜间模式下的CSS样式是确定值的节点。
其中,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:当所述夜间模式的CSS样式为应用于所述Dom Tree中的所有未经遍历的节点的第二类夜间模式的CSS样式时,将所有未经遍历的节点的CSS样式设置为所述第二类夜间模式的CSS样式指定的背景色和边框颜色。
其中,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:当所述夜间模式的CSS样式为应用于所述Dom Tree中的特殊节点的第三类夜间模式的CSS样式时,遍历所述Dom Tree的每个可显示的节点时为所述特殊节点增加第一class或属性,获取所述特殊节点的原始样式,并当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;其中,所述特殊节点为具有特殊的背景、边框或文本颜色样式的节点。
其中,所述预设条件为所述原始样式的属性值高于预定阈值或者满足预定的正则表达式。
其中,所述当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色的步骤具体为:当所述原始样式的属性满足预设条件时,为所述特殊节点对应特殊样式增加第二class或属性,所述第三类夜间模式的CSS样式选中具有所述第二class或属性的节点将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;以及为每个所述特殊节点增加第三class或属性。
其中,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:当所述夜间模式的CSS样式为应用于所述Dom Tree中的第二设定节点的第四类夜间模式的CSS样式时,遍历所述Dom Tree的每个可显示的节点以获取所述第二设定节点,并将所述第二设定节点的CSS样式设置为所述第四类夜间模式的CSS样式指定的背景色、边框色和文字颜色;其中,所述第二设定节点为具有所述第三class或属性且不具有所述第二class或属性的节点。
其中,所述当浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示的步骤之后,所述方法还包括:监听所述网页是否插入新的网页元素;当所述网页插入新的网页元素时,所述浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述新的网页的网页元素进行显示。
其中,所述夜间模式的CSS样式的级联优先级高于所述网页的原始CSS样式的级联优先级。
为解决上述技术问题,本发明采用的另一个技术方案是:提供一种网页的夜间模式处理装置,所述装置包括:CSS样式注入模块,用于通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中;CSS样式应用模块,用于解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示。
其中,所述装置还包括:注册模块,用于通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类;所述CSS样式注入模块在加载网页时,通过所述NSURLProtocol的子类将所述夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中。
其中,所述CSS样式应用模块具体用于解析所述网页的主文档生成对应的DomTree;解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的DomTree,使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的第一设定节点的第一类夜间模式的CSS样式时,所述CSS样式应用模块将所述第一设定节点的CSS样式设置为所述第一类夜间模式的CSS样式指定的背景色、边框颜色或文本颜色;其中,所述第一设定节点为在夜间模式下的CSS样式是确定值的节点。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的所有未经遍历的节点的第二类夜间模式的CSS样式时时,所述CSS样式应用模块将所有未经遍历的节点的CSS样式设置为所述第二类夜间模式的CSS样式指定的背景色和边框颜色。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的特殊节点的第三类夜间模式的CSS样式时,所述CSS样式应用模块遍历所述DomTree的每个可显示的节点时为所述特殊节点增加第一class或属性,获取所述特殊节点的原始样式,并当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;其中,所述特殊节点为具有特殊的背景、边框或文本颜色样式的节点。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的第二设定节点的第四类夜间模式的CSS样式时,所述CSS样式应用模块遍历所述Dom Tree的每个可显示的节点以获取所述第二设定节点,并将所述第二设定节点的CSS样式设置为所述第四类夜间模式的CSS样式指定的背景色、边框色和文字颜色;其中,所述第二设定节点为具有所述第三class或属性且不具有所述第二class或属性的节点。
其中,所述CSS样式应用模块具体用于解析所述网页的主文档生成对应的DomTree;解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的DomTree,使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的第一设定节点的第一类夜间模式的CSS样式时,所述CSS样式应用模块将所述第一设定节点的CSS样式设置为所述第一类夜间模式的CSS样式指定的背景色、边框颜色或文本颜色;其中,所述第一设定节点为在夜间模式下的CSS样式是确定值的节点。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的所有未经遍历的节点的第二类夜间模式的CSS样式时,所述CSS样式应用模块将所有未经遍历的节点的CSS样式设置为所述第二类夜间模式的CSS样式指定的背景色和边框颜色。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的特殊节点的第三类夜间模式的CSS样式时,所述CSS样式应用模块遍历所述DomTree的每个可显示的节点时为所述特殊节点增加第一class或属性,获取所述特殊节点的原始样式,并当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;其中,所述特殊节点为具有特殊的背景、边框或文本颜色样式的节点。
其中,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述DomTree中的第二设定节点的第四类夜间模式的CSS样式时,所述CSS样式应用模块遍历所述Dom Tree的每个可显示的节点以获取所述第二设定节点,并将所述第二设定节点的CSS样式设置为所述第四类夜间模式的CSS样式指定的背景色、边框色和文字颜色;其中,所述第二设定节点为具有所述第三class或属性且不具有所述第二class或属性的节点。
为解决上述技术问题,本发明采用的另一个技术方案是:提供一种网页的夜间模式处理移动终端,所述终端包括网页的夜间模式处理装置。
本发明的有益效果是:本发明提供的网页的夜间模式处理方法及装置,当加载网页时将该夜间模式的CSS样式及相关的JavaScript处理脚本注入到该网页的主文档中,当浏览器解析该主文档时,会运行注入的JavaScript脚本,将夜间模式的CSS样式应用到该网页的每一个网页元素上,覆盖掉网页原有的样式,从而实现更好的夜间模式显示效果,例如黑底白字效果等,并保持原网页的布局,改善用户的浏览体验效果。
附图说明
图1是本发明网页的夜间模式处理方法第一实施方式的流程图;
图2是本发明网页的夜间模式处理方法第二实施方式的流程图;
图3是本发明网页的夜间模式处理方法中进行夜间模式的CSS样式应用的方法流程图;
图4是本发明网页的夜间模式处理方法第三实施方式的流程图;
图5是本发明网页的夜间模式处理装置的第一实施方式的结构示意图;
图6是本发明网页的夜间模式处理装置的第二实施方式的结构示意图;
图7是本发明网页的夜间模式处理装置的第三实施方式的结构示意图;
图8是本发明网页的夜间模式处理移动终端的实施方式的结构示意图。
具体实施方式
下面结合附图和实施方式对本发明进行详细说明。
请参阅图1,为本发明网页的夜间模式处理方法第一实施方式的流程图,该方法包括:
步骤S10:浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中。
其中,该夜间模式的CSS样式的级联优先级高于该网页的原始CSS样式的级联优先级。
具体地,为该夜间模式的CSS样式增加!important属性,使夜间模式的CSS样式的级联优先级高于网页原始的CSS样式的级联优先级。
步骤S11,浏览器解析该网页的主文档,执行该JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示。
利用本发明实施方式,当加载网页时,将该夜间模式的CSS样式及相关的JavaScript处理脚本注入到该网页的主文档,当浏览器内核解析该主文档时,会运行注入的JavaScript脚本。通过运行注入的JavaScript脚本,将注入的夜间模式CSS样式应用到该网页的每一个网页元素上,覆盖掉网页原有的样式,从而实现更好的夜间模式显示效果,例如黑底白字的效果等,并保持原网页的布局。
请参阅图2,步骤S10之前,即,浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中的步骤之前,还包括如下步骤:
步骤S20,通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类。
步骤S10,即,浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中的步骤,具体可通过如下步骤实现:
步骤S21,浏览器在加载网页时,通过该NSURLProtocol的子类将该夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中。
由于iOS操作系统具有封闭性,不允许第三方浏览器使用自有内核,但是为了让开发者有机会处理网络相关的请求,iOS操作系统提供了一组处理网络请求相关的接口,称为URL Loading System。在本实施方式中,该网页的夜间模式处理方法是基于iOS操作系统实现的,通过注册自定义的NSURLProtocol子类,就可以处理相应的网络请求,例如本发明的网页的夜间模式处理。
具体地,当浏览器程序启动后且加载网页之前,通过NSURLProtocol的类方法+[NSURLProtocol registerClass:]向iOS操作系统注册自定义的NSURLProtocol的子类。这样,该NSURLProtocol的子类就可以处理所有网页资源加载相关的网络请求。
进一步地,当执行步骤S21时,即,浏览器在加载网页时,通过该NSURLProtocol的子类将该夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中时,通过预先注册的NSURLProtocol的子类对所有的资源请求类型进行判断。当确定是主文档的请求时,如果此时夜间模式已开启,则将夜间模式的CSS样式和相关的JavaScript脚本注入到主文档,并传输至浏览器内核。
步骤S22,浏览器解析该网页的主文档执行JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示。
图2中的步骤请对应参见图1的步骤以及相应的文字说明。
请参阅图3,步骤S11,即,浏览器解析该网页的主文档执行该JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示的步骤,具体可通过如下步骤实现:
步骤S30,该浏览器解析该网页的主文档生成对应的Dom树(Dom Tree)。
具体地,网页的Dom Tree是通过解析网页的主文档以及主文档中引用的子资源生成。
步骤S31,浏览器解析并执行该JavaScript,将该夜间模式的CSS样式添加到当前网页的Dom Tree。
具体地,该浏览器执行注入该JavaScript时创建一个style节点,将该夜间模式的CSS样式内容放到该style节点内,再将该style节点添加到网页的Dom Tree。
其中,该夜间模式的CSS样式包含了多条CSS样式规则。根据CSS样式规则在夜间模式处理过程中的作用,将该夜间模式的CSS样式分为以下四类,并结合这四类CSS样式对步骤S32,即,浏览器解析并执行该JavaScript,将该夜间模式的CSS样式添加到当前网页的Dom Tree的步骤进行详细的说明。
当该夜间模式的CSS样式为应用于Dom Tree中的第一设定节点的第一类夜间模式的CSS样式(以下简称第一类样式)时,将该第一设定节点的CSS样式设置为该第一类样式指定的背景色、边框颜色或文本颜色。
其中,该第一设定节点为在夜间模式下的CSS样式是确定值的节点。例如,夜间模式下的html、body的背景色总是黑灰色,则该第一类样式指定html、body的背景色为黑灰色。
由于第一设定节点在夜间模式下的CSS样式是确定的,因此能够直接将该第一类样式应用于这些节点,以设置这些节点在夜间模式下的CSS样式。
另外,该第一类样式还可以指定所有节点的文字颜色以及部分节点的伪元素属性的CSS样式,例如,除a标签以及其后代节点以外的节点的文字颜色在夜间模式下总是类白色,则该第一类样式指定大部分节点的文字颜色为灰白色,设定a标签以及其后代元素的文字颜色为浅蓝色,设定访问过的a标签以及其后代节点颜色为浅紫色等。
当该夜间模式的CSS样式为应用于Dom Tree中的所有未经遍历的节点的第二类夜间模式的CSS样式(以下简称第二类样式)时,将所有未经遍历的节点的CSS样式设置为该第二类样式指定的背景色和边框颜色。
其中,该第二类样式指定的背景色值和边框颜色为默认的背景色值和边框颜色值,一般指定为黑灰色。由于遍历节点的处理会花费比较多的时间,通过第二类样式在遍历节点处理前将全部节点(未经过遍历的节点)都设定为默认的背景色值和边框色值,能够避免出现打开页面先闪显页面的原始样式,再变到夜间模式的过程,以改变浏览体验比较差的情况。
当该夜间模式的CSS样式为应用于Dom Tree中的特殊节点的第三类夜间模式的CSS样式(以下简称第三类样式)时,遍历该Dom Tree的每个可显示的节点时为该特殊节点增加第一class或属性,获取该特殊节点的原始样式,并当该原始样式的属性满足预设条件时将该特殊节点的CSS样式设置为该第三类样式指定的背景色和边框颜色。
在本实施方式中,该特殊节点为通过CSS样式的ID或class选择器指定具有特殊的背景、边框或文本颜色样式的节点。例如,该特殊样式具有白色或接近白色的高亮背景色,具有背景图,渐变背景或半透明背景,全透明背景,白色或接近白色的高亮边框颜色等特殊元素。在其他实施方式中,该特殊节点还可以通过其他方式指定其特殊的背景、边框或文本颜色的样式。
由于全部节点都如上所述被第二类样式指定为默认的背景色和边框颜色,使得所有的网页元素背景都变成了不透明的黑灰色,包括这些特殊节点。这些特殊节点的全透明的、半透明的、渐变的背景以及图片背景、边框等都变成了等于或接近于背景色的黑灰色,这样就改变了网页原来的结构。所以需要通过遍历每个节点,将这些特殊节点的特殊属性恢复。
对于这些特殊节点,需要通过计算原始样式的属性值来决定是否需要将该第二类样式指定的样式更改为特殊样式。例如,保留或删除背景图、是否添加夜间模式的透明颜色属性、是否修改边框颜色、是否为节点添加全透明class标记等。
具体地,在遍历该Dom Tree的每个可显示节点时,为该些特殊节点增加第一class或属性,该第二类样式通过:not选择器选择该Dom Tree中不具有该第一class或属性的节点,使得这些特殊节点在进行节点遍历时不被该第二类样式选中,这样特殊节点就恢复了其原有样式的属性。例如,该第二类样式通过*:not(.ucbrowser_unnic_class)选择不具有ucbrowser_unnic_class class的节点,或通过*not:([ucbrwoser_unnic_prop])选择不具有ucbrwoser_unnic_prop属性的节点。
进一步地,通过getComputedStyle获取该些特殊节点的原始样式,利用阈值或正则表达式,判断该特殊节点的原始样式的属性值是否超过预定阈值或者是否满足预定的正则表达式。若是,则确定该特殊节点为需要修改样式的节点,并给该特殊节点增加相应的第二class或属性,且对应该特殊节点具有的多个特殊属性增加对应的第二class或属性,使其可以被该第三类样式选中。例如,当该特殊节点的原始样式的属性值大于预设阈值时,确定需要删除背景图以及设置为半透明,相应的第二class为ucbrowser_delBgImg class以及ucbrowser_changeBgLinear class;当该特殊节点的原始样式的背景颜色满足预设的正则表达式RegExp('rgba\\(\\s*?\\d+?\\s*?,\\s*?\\d+?\\s*?,\\s*?\\d+?\\s*?,\\s*?0\\s*?\\)','i')时,确定该节点的背景为透明背景,需要设置为透明背景,则该第二class为ucbrowser_transparentBkg class。同样地,该特殊节点需要设置透明标记时,则该第二class为ucbrowser_transparentBkg class。
该第三类样式通过class或属性选择器选中具有如上所述的第二class或属性的特殊节点,并指定其夜间模式的背景色或边框颜色、透明度、或标记该节点具有某个特殊属性等。例如,该第三类样式通过.ucbrowser_delBgImg{background-image:none!important;}规则设置节点不使用背景图,通过.ucbrowser_changeBgLinear{background:rgba(40,40,40,0.6)!important;}规则为节点指定半透明的背景,通过.ucbrowser_changeBorder{border-color:#414c61!important;}规则设置网页元素的边框颜色,通过.ucbrowser_transparentBkg{}规则标记该节点为透明背景。
例如,当将RGB颜色分量值都在160以上的颜色值认为是白色或接近于白色时,若节点的原始样式的边框颜色值满足这个条件(预设阈值),则为这个节点增加的第二class为ucbrowser_changeBorder,使该节点可以被第三类样式的.ucbrowser_changeBorder{border-color:#414c61!important;}规则选中,从而将边框颜色设置为深灰蓝色。如果背景图属性中包含RGB或-webkit-gradient(预设正则表达式),说明这个节点使用了渐变的背景,则为这个节点增加的第二class为ucbrowser_changeBgLinear class,使其可以被第三类样式中的.ucbrowser_changeBgLinear{background:rgba(40,40,40,0.6)!important;}规则选中,从而在夜间模式下将其显示为半透明的效果。
在遍历该Dom Tree节点前,该第三类样式不会选中任何节点。
进一步地,当该第三类样式对特殊节点完成如上所述的夜间模式的样式转换处理后,还为每个特殊节点再增加第三class或属性,以表示该节点已经经过了夜间模式的转换处理。例如,该第三class属性为ucbrowser_process_done class。
当该夜间模式的CSS样式为应用于该Dom Tree中的第二设定节点的第四类夜间模式的CSS样式(以下简称第四类样式)时,遍历该DomTree的每个可显示的节点,获取该第二设定节点,并将该第二设定节点的夜间模式的CSS样式设置为该第四类样式指定的背景色、边框颜色和文字颜色。其中,该第二设定节点为具有该第三class或属性且不具有该第二class或属性的节点。即,当节点没有被第一类样式和第三类样式指定夜间模式的样式时,由该第四类样式对其进行样式转换的处理。
利用第一、二、三类样式通过如上所述对节点进行夜间模式的转换处理,特殊节点中已经被添加相应的第二class或属性并被第三类样式设置了对应的CSS样式,或增加了相应的第二class或属性表示具有特殊的属性。而未被增加第二class或属性的节点,说明不具有特殊的背景颜色、边框颜色或透明属性等,这些节点还未被设置相应的夜间模式的CSS样式。该第四类样式就是对这类节点进行夜间模式的转换处理。
具体地,该第四类样式通过class或属性选择器选择具有第三class或属性的节点以确定经过遍历处理的节点,并通过:not选择器在确定的经过遍历处理的节点中选择未被增加第二class或属性的节点,并将这些节点的背景颜色、边框颜色和文字颜色设置该第四类样式指定的夜间模式的CSS样式。
例如,div元素没有被第一类样式设置背景色,且具有第三class属性为classucbrowser_process_done,表示经过了夜间模式样式的转换处理,以及该节点不具有第二class,即,该节点不具有透明属性、渐变属性,以及不具有白色或接近白色的高亮背景色。那么这个div节点的背景在夜间模式下应该是一个黑灰色,则由该第四类样式通过规则div.ucbrowser_process_done:not(.ucbrowser_transparentkg):not(.ucbrowser_changeBgLinear):not(.ucbrowser_setBackground){background-color:
#353840!important;}将该div节点的的背景色设置为黑灰色。
因此,经过第四类样式的处理,如果节点不具有透明、半透明或渐变的背景,以及背景、边框样式又没有被第一类样式设置,就会被第四类样式设置为黑灰的背景、浅蓝色边框。
当该Dom Tree的所有节点通过如上所述的遍历处理完成后,整个网页就显示了夜间模式的效果。
进一步地,由于网页的Dom Tree可能包含比较多的节点,一次性遍历所有节点可能会引起页面划动卡顿,处理过的节点得不到及时渲染。所以,在本实施方式中,遍历节点时,采用分片处理的方式,一次只处理一部分节点,然后等待一小段时间,让UI得到响应,使节点得到及时更新。
请参阅图4,为本发明网页的夜间模式处理方法第三实施方式的流程图,该方法包括:
步骤S40,浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中。
步骤S41,浏览器解析该网页的主文档执行JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示。
步骤S42,监听该网页是否插入新的网页元素。若是,则返回步骤S41,否则,重复步骤S42。
具体地,通过注册的DOMNodeInserted事件监该听网页,当该网页中有新的网页元素插入时,例如,弹窗、子窗口等,对这些新的网页元素进行如步骤S41所述的处理方式,将该夜间模式的CSS样式应用到该新的网页元素进行显示。
图4中的步骤请对应参见图1以及相应的文字说明。
在其他实施方式中,图4中其它的步骤还可以参见图2以及相应的文字说明。
请参阅图5,为本发明网页的夜间模式处理装置的第一实施方式的结构示意图,该装置50包括:CSS样式注入模块51以及CSS样式应用模块52。
该CSS样式注入模块51用于通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中。其中,该夜间模式的CSS样式的级联优先级高于该网页的原始CSS样式的级联优先级。具体地,该CSS样式注入模块51为该夜间模式的CSS样式增加!important属性,使夜间模式的CSS样式的级联优先级高于网页原始的CSS样式的级联优先级。
该CSS样式应用模块52用于解析该网页的主文档,执行该JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示。
利用本发明实施方式,当加载网页时,该CSS样式注入模块51将该夜间模式的CSS样式及相关的JavaScript处理脚本注入到该网页的主文档,当浏览器内核解析该主文档时,该CSS样式应用模块52会运行注入的JavaScript,通过运行注入的JavaScript脚本,将注入的夜间模式CSS样式应用到该网页的每一个网页元素上,覆盖掉网页原有的样式,从而实现更好的夜间模式显示效果,例如黑底白字的效果等,并保持原网页的布局。
请参阅图6,该装置60包括CSS样式注入模块61、CSS样式应用模块62以及注册模块63。
该注册模块63用于通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类。具体地,当浏览器程序启动后且加载网页之前,该注册模块63通过NSURLProtocol的类方法+[NSURLProtocolregisterClass:]向iOS操作系统注册自定义的NSURLProtocol的子类。这样,该NSURLProtocol的子类就可以处理所有网页资源加载相关的网络请求。
该CSS样式注入模块61用于通过该NSURLProtocol的子类将该夜间模式的CSS样式及其对应JavaScript脚本注入该网页的主文档中。
该CSS样式应用模块62用于解析该网页的主文档,执行该JavaScript,将该夜间模式的CSS样式应用到该网页的网页元素进行显示。
进一步地,该CSS样式应用模块62解析该网页的主文档生成对应的Dom Tree,以及解析并执行该JavaScript以将该夜间模式的CSS样式添加到当前网页的Dom Tree。
具体地,网页的Dom Tree是该CSS样式应用模块62通过解析该网页的主文档以及主文档中引用的子资源生成。该CSS样式应用模块62执行该JavaScript时创建一个style节点,将该夜间模式的CSS样式内容放到该style节点内,再将该style节点添加到网页的DomTree。
其中,该夜间模式的CSS样式包含了多条CSS样式规则。根据CSS样式规则在夜间模式处理过程中的作用,将该夜间模式的CSS样式分为以下四类,并结合这四类CSS样式对该CSS样式应用模块62解析并执行该JavaScript,将该夜间模式的CSS样式添加到当前网页的Dom Tree进行详细的说明。
当该夜间模式的CSS样式为应用于Dom Tree中的第一设定节点的第一类样式时,该CSS样式应用模块62将该第一设定节点的CSS样式设置为该第一类样式指定的背景色、边框颜色或文本颜色。其中,该第一设定节点为在夜间模式下的CSS样式是确定值的节点。
当该夜间模式的CSS样式为应用于Dom Tree中的所有未经遍历的节点的第二类样式时,该CSS样式应用模块62将所有未经遍历的节点的CSS样式设置为该第二类样式指定的背景色和边框颜色。其中,该第二类样式指定的背景色值和边框颜色为默认的背景色值和边框颜色值,一般指定为黑灰色。
当该夜间模式的CSS样式为应用于Dom Tree中的特殊节点的第三类样式时,该CSS样式应用模块62遍历该Dom Tree的每个可显示的节点时为该特殊节点增加第一class或属性,获取该特殊节点的原始样式,并当该原始样式的属性满足预设条件时将该特殊节点的CSS样式设置为该第三类样式指定的背景色和边框颜色。在本实施方式中,该特殊节点为通过CSS样式的ID或class选择器指定具有特殊的背景、边框或文本颜色样式的节点。例如,该特殊样式具有白色或接近白色的高亮背景色,具有背景图,渐变背景或半透明背景,全透明背景,白色或接近白色的高亮边框颜色等特殊元素。
具体地,该CSS样式应用模块62在遍历该Dom Tree的每个可显示节点时,为该些特殊节点增加第一class或属性,使该第二类样式通过:not选择器选择该Dom Tree中不具有该第一class或属性的节点,使得这些特殊节点在进行节点遍历时不被该第二类样式选中,这样特殊节点就恢复了其原有样式的属性。
进一步地,该CSS样式应用模块62通过getComputedStyle获取该些特殊节点的原始样式,利用阈值或正则表达式,判断该特殊节点的原始样式的属性值是否超过预定阈值或者是否满足预定的正则表达式。若是,则确定该特殊节点为需要修改样式的节点,并给该特殊节点增加相应的第二class或属性,且对应该特殊节点具有的多个特殊属性增加对应的第二class或属性,使其可以被该第三类样式选中。
该第三类样式通过class或属性选择器选中具有如上所述的第二class或属性的特殊节点,并指定其夜间模式的背景色或边框颜色、透明度、或标记该节点具有某个特殊属性等。
例如,当将RGB颜色分量值都在160以上的颜色值认为是白色或接近于白色时,若节点的原始样式的边框颜色值满足这个条件(预设阈值),则为这个节点增加的第二class为ucbrowser_changeBorder,使该节点可以被第三类样式的.ucbrowser_changeBorder{border-color:#414c61!important;}规则选中,从而将边框颜色设置为深灰蓝色。如果背景图属性中包含RGB或-webkit-gradient(预设正则表达式),说明这个节点使用了渐变的背景,则为这个节点增加的第二class为ucbrowser_changeBgLinear class,使其可以被第三类样式中的.ucbrowser_changeBgLinear{background:rgba(40,40,40,0.6)!important;}规则选中,从而在夜间模式下将其显示为半透明的效果。
在遍历该Dom Tree节点前,该第三类样式不会选中任何节点。
进一步地,当该第三类样式对特殊节点完成如上所述的夜间模式的样式转换处理后,还为每个特殊节点再增加第三class或属性,以表示该节点已经经过了夜间模式的转换处理。
当该夜间模式的CSS样式为应用于该Dom Tree中的第二设定节点的第四类样式时,该CSS样式应用模块62遍历该Dom Tree的每个可显示的节点,获取该第二设定节点,并将该第二设定节点的夜间模式的CSS样式设置为该第四类样式指定的背景色、边框颜色和文字颜色。其中,该第二设定节点为具有该第三class或属性且不具有该第二class或属性的节点。
具体地,该CSS样式应用模块62使用该第四类样式通过class或属性选择器选择具有第三class或属性的节点以确定经过遍历处理的节点,并通过:not选择器在确定的经过遍历处理的节点中选择未被增加第二class或属性的节点,并将这些节点的背景颜色、边框颜色和文字颜色设置该第四类样式指定的夜间模式的CSS样式,例如,设置为黑灰的背景、浅蓝色边框。
因此,当,该CSS样式应用模块62通过如上所述遍历该Dom Tree的所有节点且处理完成后,整个网页就显示了夜间模式的效果。
图6中的模块请对应参见图5以及相应的文字说明。
请参见图7,该装置70包括CSS样式注入模块71、CSS样式应用模块72、注册模块73以及监听模块74。
其中,该监听模块74用于监听该网页是否插入新的网页元素,
具体地,该监听模块74通过注册的DOMNodeInserted事件监该听网页,当该网页中有新的网页元素插入时,例如,弹窗、子窗口等,该CSS样式应用模块72对这些新的网页元素进行如上所述的处理方式,将该夜间模式的CSS样式应用到该新的网页元素进行显示。
图7中的CSS样式注入模块71、CSS样式应用模块72、注册模块73请对应参见图6及相应的文字说明。
请参阅图8,为本发明网页夜间模式处理移动终端实施方式的结构示意图。该移动终端80包括处理装置81,其中,该处理装置81包括CSS样式注入模块810以及CSS样式应用模块811,这些模块请对应参见图5及相应的文字说明。
在其他实施方式中,该处理装置81以包括CSS样式注入模块和CSS样式应用模块,还包括注册模块和/或监听模块,这些模块请对应参见图6图7及相应的文字说明。
本发明提供的网页的夜间模式处理方法,当加载网页时将该夜间模式的CSS样式及相关的JavaScript处理脚本注入到该网页的主文档中,当浏览器解析该主文档时,会运行注入的JavaScript脚本,将夜间模式的CSS样式应用到该网页的每一个网页元素上,覆盖掉网页原有的样式,从而实现诸如黑底白字的夜间模式效果,并保持原网页的布局,改善用户的浏览体验效果。
以上所述仅为本发明的实施方式,并非因此限制本发明的专利范围,凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换,或直接或间接运用在其他相关的技术领域,均同理包括在本发明的专利保护范围内。
Claims (16)
1.一种网页的夜间模式处理方法,其特征在于,所述方法包括:
浏览器在加载网页时,通过终端封闭式的操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中;以及
浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示;
所述浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示的步骤包括:
所述浏览器解析所述网页的主文档生成对应的Dom Tree;
所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,使所述夜间模式的CSS样式应用到所述网页的网页元素进行显示;
所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,使所述夜间模式的CSS样式应用到所述网页的网页元素进行显示的步骤包括:
当所述夜间模式的CSS样式为应用于所述Dom Tree中的第一设定节点的第一类夜间模式的CSS样式时,将所述第一设定节点的CSS样式设置为所述第一类夜间模式的CSS样式指定的背景色、边框颜色或文本颜色;其中,所述第一设定节点为在夜间模式下的CSS样式是确定值的节点。
2.根据权利要求1所述的网页夜间模式处理方法,其特征在于,所述浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中的步骤之前,所述方法还包括:
通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类;
所述浏览器在加载网页时,通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中的步骤具体为:
所述浏览器在加载网页时,通过所述NSURLProtocol的子类将所述夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中。
3.根据权利要求1所述的网页的夜间模式处理方法,其特征在于,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:
当所述夜间模式的CSS样式为应用于所述Dom Tree中的所有未经遍历的节点的第二类夜间模式的CSS样式时,将所有未经遍历的节点的CSS样式设置为所述第二类夜间模式的CSS样式指定的背景色和边框颜色。
4.根据权利要求3所述的网页的夜间模式处理方法,其特征在于,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:
当所述夜间模式的CSS样式为应用于所述Dom Tree中的特殊节点的第三类夜间模式的CSS样式时,遍历所述Dom Tree的每个可显示的节点时为所述特殊节点增加第一class或属性,获取所述特殊节点的原始样式,并当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;其中,所述特殊节点为具有特殊的背景、边框或文本颜色样式的节点。
5.根据权利要求4所述的网页的夜间模式处理方法,其特征在于,所述预设条件为所述原始样式的属性值高于预定阈值或者满足预定的正则表达式。
6.根据权利要求4或5所述的网页的夜间模式处理方法,其特征在于,所述当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色的步骤具体为:
当所述原始样式的属性满足预设条件时,为所述特殊节点对应特殊样式增加第二class或属性,所述第三类夜间模式的CSS样式选中具有所述第二class或属性的节点将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;以及
为每个所述特殊节点增加第三class或属性。
7.根据权利要求6所述的网页的夜间模式处理方法,其特征在于,所述浏览器解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,以使所述夜间模式的CSS样式应用到所述网页的的网页元素进行显示的步骤包括:
当所述夜间模式的CSS样式为应用于所述Dom Tree中的第二设定节点的第四类夜间模式的CSS样式时,遍历所述Dom Tree的每个可显示的节点以获取所述第二设定节点,并将所述第二设定节点的CSS样式设置为所述第四类夜间模式的CSS样式指定的背景色、边框色和文字颜色;其中,所述第二设定节点为具有第三class或属性且不具有所述第二class或属性的节点。
8.根据权利要求1所述的网页的夜间模式处理方法,其特征在于,所述浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示的步骤之后,所述方法还包括:
监听所述网页是否插入新的网页元素;
当所述网页插入新的网页元素时,所述浏览器解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述新的网页的网页元素进行显示。
9.根据权利要求1所述的网页夜间模式处理方法,其特征在于,所述夜间模式的CSS样式的级联优先级高于所述网页的原始CSS样式的级联优先级。
10.一种网页的夜间模式处理装置,其特征在于,所述装置包括:
CSS样式注入模块,用于通过终端操作系统提供的处理网络请求的接口,将夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中;
CSS样式应用模块,用于解析所述主文档,执行所述JavaScript,将所述夜间模式的CSS样式应用到所述网页的网页元素进行显示;
所述CSS样式应用模块具体用于解析所述网页的主文档生成对应的Dom Tree;解析并执行所述JavaScript,将所述夜间模式的CSS样式添加到所述网页的Dom Tree,使所述夜间模式的CSS样式应用到所述网页的网页元素进行显示;
所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述Dom Tree中的第一设定节点的第一类夜间模式的CSS样式时,
所述CSS样式应用模块将所述第一设定节点的CSS样式设置为所述第一类夜间模式的CSS样式指定的背景色、边框颜色或文本颜色;其中,所述第一设定节点为在夜间模式下的CSS样式是确定值的节点。
11.根据权利要求10所述的网页夜间模式处理装置,其特征在于,所述装置还包括:
注册模块,用于通过NSURLProtocol向iOS系统注册自定义的NSURLProtocol的子类;
所述CSS样式注入模块在加载网页时,通过所述NSURLProtocol的子类将所述夜间模式的CSS样式及其对应JavaScript脚本注入所述网页的主文档中。
12.根据权利要求10所述的网页夜间模式处理装置,其特征在于,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述Dom Tree中的所有未经遍历的节点的第二类夜间模式的CSS样式时,
所述CSS样式应用模块将所有未经遍历的节点的CSS样式设置为所述第二类夜间模式的CSS样式指定的背景色和边框颜色。
13.根据权利要求12所述的网页夜间模式处理装置,其特征在于,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述Dom Tree中的特殊节点的第三类夜间模式的CSS样式时,
所述CSS样式应用模块遍历所述Dom Tree的每个可显示的节点时为所述特殊节点增加第一class或属性,获取所述特殊节点的原始样式,并当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;其中,所述特殊节点为具有特殊的背景、边框或文本颜色样式的节点。
14.根据权利要求13所述的网页夜间模式处理装置,其特征在于,所述当所述原始样式的属性满足预设条件时将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色包括:
当所述原始样式的属性满足预设条件时,为所述特殊节点对应特殊样式增加第二class或属性,所述第三类夜间模式的CSS样式选中具有所述第二class或属性的节点将所述特殊节点的CSS样式设置为所述第三类样式指定的背景色和边框颜色;以及
为每个所述特殊节点增加第三class或属性。
15.根据权利要求14所述的网页夜间模式处理装置,其特征在于,所述CSS样式注入模块注入的所述夜间模式的CSS样式为应用于所述Dom Tree中的第二设定节点的第四类夜间模式的CSS样式时,
所述CSS样式应用模块遍历所述Dom Tree的每个可显示的节点以获取所述第二设定节点,并将所述第二设定节点的CSS样式设置为所述第四类夜间模式的CSS样式指定的背景色、边框色和文字颜色;其中,所述第二设定节点为具有所述第三class或属性且不具有所述第二class或属性的节点。
16.一种移动终端,其特征在于,所述终端包括如权利要求11至15任一项所述的网页的夜间模式处理装置。
Priority Applications (2)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410830793.XA CN105786924B (zh) | 2014-12-25 | 2014-12-25 | 网页夜间模式处理方法、装置及移动终端 |
US14/998,315 US10409899B2 (en) | 2014-12-25 | 2015-12-24 | Method, device and mobile terminal for processing webpage in night mode |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410830793.XA CN105786924B (zh) | 2014-12-25 | 2014-12-25 | 网页夜间模式处理方法、装置及移动终端 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN105786924A CN105786924A (zh) | 2016-07-20 |
CN105786924B true CN105786924B (zh) | 2020-03-31 |
Family
ID=56164348
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201410830793.XA Active CN105786924B (zh) | 2014-12-25 | 2014-12-25 | 网页夜间模式处理方法、装置及移动终端 |
Country Status (2)
Country | Link |
---|---|
US (1) | US10409899B2 (zh) |
CN (1) | CN105786924B (zh) |
Families Citing this family (15)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105677654B (zh) * | 2014-11-18 | 2020-07-03 | 阿里巴巴(中国)有限公司 | 广告过滤方法及装置 |
CN106354873B (zh) * | 2015-09-22 | 2019-12-20 | 广州神马移动信息科技有限公司 | 网页加载方法、装置及系统 |
WO2017078705A1 (en) * | 2015-11-04 | 2017-05-11 | Observepoint, Inc. | Automatic execution of objects in a user interface |
WO2017136755A1 (en) | 2016-02-04 | 2017-08-10 | Observepoint, Inc. | Analyzing analytic element network traffic |
GB2561802A (en) | 2016-02-09 | 2018-10-24 | Observepoint Inc | Managing network communication protocols |
US9799131B1 (en) | 2016-04-25 | 2017-10-24 | Google Inc. | Rendering interaction statistics data for content elements of an information resource by identifying client device segments |
US10212061B2 (en) * | 2016-04-25 | 2019-02-19 | Google Llc | Dynamically rendering interaction statistics data for content elements of an information resource using visual styles |
CN106469439A (zh) * | 2016-08-30 | 2017-03-01 | 乐视控股(北京)有限公司 | 一种夜间模式中图片的处理方法及装置 |
US10482843B2 (en) | 2016-11-07 | 2019-11-19 | Qualcomm Incorporated | Selective reduction of blue light in a display frame |
CN108073647B (zh) * | 2016-11-14 | 2020-06-30 | 腾讯科技(深圳)有限公司 | 网页显示方法及装置 |
CN108108367B (zh) * | 2016-11-24 | 2021-10-26 | 腾讯科技(深圳)有限公司 | 一种网页显示方法和装置 |
CN106953991A (zh) * | 2017-05-22 | 2017-07-14 | 北京小米移动软件有限公司 | 显示模式切换方法及装置 |
US11217205B2 (en) | 2018-07-12 | 2022-01-04 | Samsung Electronics Co., Ltd. | Method and apparatus for rendering contents for vision accessibility |
CN110609722B (zh) | 2019-08-09 | 2021-07-20 | 华为技术有限公司 | 一种暗模式显示界面处理方法、电子设备与存储介质 |
CN114119375A (zh) * | 2022-01-25 | 2022-03-01 | 广州市玄武无线科技股份有限公司 | 一种实现iOS端自动生成长截图的方法及系统 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103258038A (zh) * | 2013-05-17 | 2013-08-21 | 广州市动景计算机科技有限公司 | 一种浏览器和网页之间的显示模式同步方法及其装置 |
CN103873491A (zh) * | 2012-12-07 | 2014-06-18 | 华耀(中国)科技有限公司 | 一种vpn安全浏览器系统及设置方法 |
CN104239514A (zh) * | 2014-09-16 | 2014-12-24 | 可牛网络技术(北京)有限公司 | 网页渲染方法、装置及移动终端 |
Family Cites Families (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US8977675B2 (en) * | 2010-03-26 | 2015-03-10 | Salesforce.Com, Inc. | Methods and systems for providing time and date specific software user interfaces |
US20150234798A1 (en) * | 2012-06-01 | 2015-08-20 | Google Inc. | System and method for changing a web ui application appearance based on state through css selector cascading |
US20140101289A1 (en) * | 2012-10-09 | 2014-04-10 | Agile Fusion Corporation | Methods and systems for selecting device applications |
CN103327194A (zh) * | 2013-06-18 | 2013-09-25 | 广东欧珀移动通信有限公司 | 浏览器皮肤亮度的模式切换方法及装置 |
US9514238B2 (en) * | 2013-10-14 | 2016-12-06 | Ebay Inc. | System and method for providing additional content on a webpage |
US9189207B2 (en) * | 2014-03-11 | 2015-11-17 | Telefonaktiebolaget L M Ericsson (Publ) | Methods and systems for dynamic runtime generation of customized applications |
US20150310125A1 (en) * | 2014-04-29 | 2015-10-29 | Barak KINARTI | Dynamic Custom Style Sheet Isolation |
-
2014
- 2014-12-25 CN CN201410830793.XA patent/CN105786924B/zh active Active
-
2015
- 2015-12-24 US US14/998,315 patent/US10409899B2/en active Active
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103873491A (zh) * | 2012-12-07 | 2014-06-18 | 华耀(中国)科技有限公司 | 一种vpn安全浏览器系统及设置方法 |
CN103258038A (zh) * | 2013-05-17 | 2013-08-21 | 广州市动景计算机科技有限公司 | 一种浏览器和网页之间的显示模式同步方法及其装置 |
CN104239514A (zh) * | 2014-09-16 | 2014-12-24 | 可牛网络技术(北京)有限公司 | 网页渲染方法、装置及移动终端 |
Also Published As
Publication number | Publication date |
---|---|
CN105786924A (zh) | 2016-07-20 |
US20160188552A1 (en) | 2016-06-30 |
US10409899B2 (en) | 2019-09-10 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN105786924B (zh) | 网页夜间模式处理方法、装置及移动终端 | |
US20220253588A1 (en) | Page processing method and related apparatus | |
KR102436987B1 (ko) | 웹페이지 콘텐츠를 추출하기 위한 방법 및 단말 장치 | |
US9792265B2 (en) | Systems and methods for hosted applications | |
US9471704B2 (en) | Shared script files in multi-tab browser | |
BR112016020142B1 (pt) | Método em um dispositivo de equipamento de usuário e meio de armazenamento não transitório legível por computador | |
CN107239491A (zh) | 用于实现用户行为追踪的方法、设备、浏览器及电子设备 | |
CN105094759B (zh) | 一种浏览模式切换处理方法及装置 | |
CN105677654B (zh) | 广告过滤方法及装置 | |
CN104731815B (zh) | 一种网页元素的绘制方法及装置 | |
CN111339458B (zh) | 页面呈现方法和装置 | |
CN111324381B (zh) | 开发系统、方法、装置、计算机设备及存储介质 | |
US20150286743A1 (en) | Method, system, and device for marking web content | |
CN105979392A (zh) | 网页显示方法和浏览器 | |
CN103488646A (zh) | 一种移动终端浏览器弱光源下浏览网页的方法及装置 | |
KR20140018414A (ko) | 브라우저 기반 애플리케이션 프로그램 확장 방법 및 디바이스 | |
CN103810193A (zh) | 网页元素屏蔽方法和装置 | |
US20150331558A1 (en) | Method for switching pictures of picture galleries and browser | |
WO2019109889A1 (zh) | 网页显示方法、浏览器、终端和计算机可读存储介质 | |
CN110764680A (zh) | 生成模拟键盘的方法、装置、电子设备及计算机可读介质 | |
CN104899212B (zh) | 网页展示方法、服务器及系统 | |
CN111694493B (zh) | 一种网页截图方法、计算机设备及可读存储介质 | |
CN111159597A (zh) | 骨架屏的生成方法、系统、计算机设备及存储介质 | |
CN108874373B (zh) | 向网页内插入信息的方法及装置、显示终端及存储介质 | |
CN105373565B (zh) | 网页处理方法及装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant | ||
TR01 | Transfer of patent right | ||
TR01 | Transfer of patent right |
Effective date of registration: 20200527 Address after: 310051 room 508, floor 5, building 4, No. 699, Wangshang Road, Changhe street, Binjiang District, Hangzhou City, Zhejiang Province Patentee after: Alibaba (China) Co.,Ltd. Address before: 510627 Guangdong city of Guangzhou province Whampoa Tianhe District Road No. 163 Xiping Yun Lu Yun Ping B radio 14 floor tower square Patentee before: GUANGZHOU UCWEB COMPUTER TECHNOLOGY Co.,Ltd. |