一种网页换肤方法、装置及浏览器制造方法及图纸

本发明专利技术提供了一种网页换肤方法、装置及浏览器，其包括：接收用户的更换界面风格的请求，其中，更换界面风格的请求包括界面风格的属性信息；根据该界面风格的属性信息生成相应的脚本；在网页文档对象模型开始加载时注入并执行该脚本，使相应的界面风格生效。采用本发明专利技术的技术方案，通过向页面中注入脚本，使得即使在没有提供界面风格更换功能的页面上，也能通过浏览器内置的该项功能来满足用户个性化需求。

【技术实现步骤摘要】
【专利摘要】本专利技术提供了一种网页换肤方法、装置及浏览器，其包括：接收用户的更换界面风格的请求，其中，更换界面风格的请求包括界面风格的属性信息；根据该界面风格的属性信息生成相应的脚本；在网页文档对象模型开始加载时注入并执行该脚本，使相应的界面风格生效。采用本专利技术的技术方案，通过向页面中注入脚本，使得即使在没有提供界面风格更换功能的页面上，也能通过浏览器内置的该项功能来满足用户个性化需求。【专利说明】一种网页换肤方法、装置及浏览器
本专利技术涉及浏览器开发
，尤其涉及一种网页换肤方法、装置及浏览器。
技术介绍
在万维网(WEB)前端开发中，一些网页提供给用户根据自己喜好选择界面风格的个性化功能，例如，背景色、文字颜色以及字体大小等，也即，为网页添加换肤效果。这既可以提供美观的界面又可以满足用户的个性化需求。该功能的实现，是在网页设计时为网页提供几个不同的级联样式表(CascadingStyle Sheet, CSS)文件，WEB页面是根据该文件中描述的样式对页面进行渲染，因此，根据用户的选择在超文本标记语言(Hypertext Markup Language, HTML)中加载不同的CSS文件，可以使得网页具有相应的界面。但是，如果网页在前端开发时没有给用户提供这种功能，用户将无法选择自己喜欢的界面，不能满足用户个性化需求。
技术实现思路
本专利技术针对上述问题，提出了一种网页换肤方法及装置，将换肤功能由浏览器本身来实现，即使网页没有提供换肤功能也可以让用户选择自己喜欢的界面皮肤，使得所有的网页都具有换肤功能。本专利技术提供了一种网页换肤方法，主要技术方案如下:接收用户的更换界面风格的请求，其中，所述更换界面风格的请求包括界面风格的属性信息；根据所述界面风格的属性信息，生成相应的脚本；在网页文档对象模型开始加载时，注入并执行所述脚本，使相应的界面风格生效。本专利技术还提供了一种网页换肤装置，主要技术方案如下:接收单元，用于接收用户的更换界面风格的请求，该请求包括界面风格的属性信息；脚本生成单元，用于根据所述界面风格的属性信息，生成相应的脚本；脚本注入和执行单元，用于在网页文档对象模型开始加载时，注入所述脚本，使相应的界面风格生效。本专利技术还提供了 一种浏览器，包括上述网页换肤装置。采用本专利技术的技术方案，通过向页面中注入脚本，使得用户在任何网页上都能实现界面风格的更换，满足用户个性化的需求。【专利附图】【附图说明】下面将参照附图描述本专利技术的具体实施例，其中:图1示出了本专利技术实施例的网页换肤方法的流程图；图2示出了本专利技术实施例的网页换肤装置的结构示意图。【具体实施方式】为了使本专利技术的技术方案及优点更加清楚明白，以下结合附图对本专利技术的示例性实施例进行进一步详细的说明，显然，所描述的实施例仅是本专利技术的一部分实施例，而不是所有实施例的穷举。本专利技术实施例提供了一种利用浏览器实现网页换肤的方法，图1示出了本专利技术实施例的网页换肤方法的流程图，包括:在浏览器客户端开发阶段或二次开发阶段，首先要确定浏览器客户端具备脚本注入和执行的能力。S101、接收用户的更换界面风格的请求，其中，更换界面风格的请求包括界面风格的属性信息。在本专利技术实施例中，当用户需要修改网页的界面风格时，在浏览器客户端页面，通过交互式操作发起更换界面风格的请求。该更换界面风格的请求中包含有界面风格的属性信息，例如，可以是界面风格标识、背景颜色、字体颜色等，对于每个属性又可以有不同的颜色，比如背景色为海洋蓝、玫瑰红等等，但不仅限于此。用户通过交互式操作发起更换界面风格的请求的方式可以有多种形式，比如说，可以在浏览器客户端开发时添加一个新的菜单，比如:在现有“工具”菜单下面增加一个子菜单，提供几个默认的可选皮肤，如背景色为海洋蓝或玫瑰红等。还可以通过在网页浏览器的地址栏输入一个预设的网址，该网址对应的站点预先存有一段脚本，在地址栏上输入该网址便可以在浏览器页面上注入该脚本，用户可以在打开的页面上或弹出的窗口中进行选择自己喜欢的界面风格等。当然，为了进一步满足用户个性化的需求，本专利技术实施例还提出可以给用户提供一个编辑页面，让用户自己定义喜欢的主题，自行选择背景色、字体颜色等皮肤样式属性信息。本专利技术实施例对选择的方式不作限制。S102、根据界面风格的属性信息生成对应的脚本。一般情况下，可以根据界面风格的属性信息生成相应的脚本，例如，CSS代码，替换掉浏览器脚本中的相应部分，从而构造几个不同界面风格。优选的，可以将这些样式表的优先级设置为高于原有界面风格的样式表的优先级，以覆盖原有的网页皮肤。例如，可以使用！important来标注，这样该样式表具有最高的优先级。比如:浏览器的脚本为:var e=document.createElement(' style')；e.setAttribute (' type' , ' text / css')；e.setAttribute {' id','界面风格标识')；e.appendChi Id (document.createTextNode ('界面风格所使用的 css 代码'))；var head=document.getElementsByTagName{' HEAD' ) ；head.appendChild (e)；对于上述脚本中“界面风格所使用的CSS代码”，举例如下:第一个界面风格所使用的CSS代码:body {font-size: 12px!important ；background-color:black!important ；color:white!important ；}第二个界面风格所使用的CSS代码:body {font-size:20px!important ；background-color:white!important ；color:black!important ；}S103、在网页文档对象模型(HTML DOM)开始加载时，注入并执行上述脚本，使相应的界面风格生效。当然，如果不需要该界面风格或要取消自定义的界面风格时，则可以向该网页注入删除样式脚本，根据“界面风格标识”来找到该界面风格的样式表并将其删除即可。删除样式脚本举例如下:var e=document.getElementById(/ 界面风格唯一标识')；if (e) e.parentNode.removeNode (e)。浏览器客户端还 可以记录用户针对当前网页所选的皮肤样式，当用户下一次打开该网页时，网页依然可以呈现为用户本次所选的皮肤样式。采用本专利技术实施例所提供的技术方案，通过向页面中注入脚本，使得用户在任何网页上，都能实现界面风格的更换。基于同一专利技术构思，本专利技术实施例还提供了一种网页换肤装置，如图2所示，该装置包括:接收单元201，用于接收用户的更换界面风格的请求，其中，该更换界面风格的请求中包括界面风格的属性信息。脚本生成单元202，用于根据界面风格的属性信息，生成相应的脚本。脚本注入和执行单元203，用于在网页文档对象模型DOM开始加载时,注入并执行上述脚本，使相应的界面风格生效。可选的，当不需要该界面风格或要取消自定义的界面风格时，脚本注入和执行单元203还用于，注入删除样式脚本，根据界面风格标识来找到该界本文档来自技高网...

【技术保护点】

【技术特征摘要】

【专利技术属性】
技术研发人员：徐友春，马健，李丁盼，
申请(专利权)人：贝壳网际北京安全技术有限公司，
类型：发明
国别省市：