一种网页渲染方法、装置、介质以及电子设备制造方法及图纸

本申请实施例公开了一种网页渲染方法、装置、介质以及电子设备。所述方法包括：确定与网页结构文件关联的多个样式资源文件；将多个所述样式资源文件分别转换为样式资源函数，所述样式资源函数包括样式标识参数，所述样式标识参数用于唯一确定所述样式资源函数；基于所述样式标识参数调用所述样式资源函数，设置所述网页结构文件中的网页元素样式。本申请技术方案可以实现元素样式隔离，同时可以提高网页渲染效率。染效率。染效率。

【技术实现步骤摘要】
一种网页渲染方法、装置、介质以及电子设备


[0001]本申请涉及计算机应用
，尤其涉及一种网页渲染方法、装置、介质以及电子设备。

技术介绍

[0002]在网页元素渲染过程中，利用自定义元素组件描述网页元素样式时，可能存在元素样式标识重复的情况。当多个元素组件渲染在同一网页页面时，可能导致元素样式错乱。
[0003]相关技术中，一般在网页构建阶段将自定义元素组件对应的样式资源文件进行合并，再基于文件合并结果，分别为各个样式资源文件确定元素样式标识，从而实现元素样式隔离，避免元素样式错乱。上述方案将样式资源文件进行合并，会增加总体文件的体积大小，提升了代码的总量，影响网页渲染效率。

技术实现思路

[0004]本申请提供了网页渲染方法、装置、介质以及电子设备，可以实现元素样式隔离，同时可以提高网页渲染效率。
[0005]根据本申请的第一方面，提供了网页渲染方法，所述方法包括：
[0006]确定与网页结构文件关联的多个样式资源文件；
[0007]将多个所述样式资源文件分别转换为样式资源函数，所述样式资源函数包括样式标识参数，所述样式标识参数用于唯一确定所述样式资源函数；
[0008]基于所述样式标识参数调用所述样式资源函数，设置所述网页结构文件中的网页元素样式。
[0009]根据本申请的第二方面，提供了网页渲染装置，所述装置包括：
[0010]样式资源文件确定模块，用于确定与网页结构文件关联的多个样式资源文件；
[0011]样式资源文件转换模块，用于将多个所述样式资源文件分别转换为样式资源函数，所述样式资源函数包括样式标识参数，所述样式标识参数用于唯一确定所述样式资源函数；
[0012]样式资源函数调用模块，用于基于所述样式标识参数调用所述样式资源函数，设置所述网页结构文件中的网页元素样式。
[0013]根据本专利技术的第三方面，本申请实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如本申请实施例所述的网页渲染方法。
[0014]根据本专利技术的第四方面，本申请实施例提供了一种电子设备，包括存储器，处理器及存储在存储器上并可在处理器运行的计算机程序，所述处理器执行所述计算机程序时实现如本申请实施例所述的网页渲染方法。
[0015]本申请实施例的技术方案，通过将与网页结构文件关联的多个样式资源文件，分别转换为样式资源函数，利用样式标识参数确定样式资源函数，基于样式标识参数调用样式资源函数，设置网页结构文件中的网页元素样式。本申请在不增加文件体积的情况下，通
过调用样式资源函数进行网页渲染，保证了文件加载速度，提高了网页渲染效率。另外，本申请实施例根据样式标识参数，为样式资源函数确定唯一性的元素样式标识，实现了元素样式隔离，使得基于元素样式标识可以对不同样式资源函数进行区分，有效避免了因元素样式标识重复导致元素样式冲突的情况出现。
[0016]应当理解，本部分所描述的内容并非旨在标识本申请的实施例的关键或重要特征，也不用于限制本申请的范围。本申请的其它特征将通过以下的说明书而变得容易理解。
附图说明
[0017]为了更清楚地说明本申请实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
[0018]图1是根据实施例一提供的网页渲染方法的流程图；
[0019]图2是根据实施例二提供的网页渲染方法的流程图；
[0020]图3是根据实施例三提供的网页渲染方法的流程图；
[0021]图4是本申请实施例四提供的网页渲染装置的结构示意图；
[0022]图5是本申请实施例五提供的一种电子设备的结构示意图。
具体实施方式
[0023]为了使本
的人员更好地理解本申请方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分的实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本申请保护的范围。
[0024]需要说明的是，本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“目标”以及“候选”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
[0025]实施例一
[0026]图1是根据实施例一提供的网页渲染方法的流程图，本实施例可适用于利用样式资源文件对网页元素进行渲染的情况，该方法可以由网页渲染装置来执行，该网页渲染装置可以采用硬件和/或软件的形式实现，并可集成于运行此系统的电子设备中。
[0027]如图1所示，该方法包括：
[0028]S110、确定与网页结构文件关联的多个样式资源文件。
[0029]其中，网页结构文件是网页内容的载体，用于确定网页结构的排版。网页内容是指网页中展示出的页面元素，示例性的，网页内容可以包括文本、图像、动画或者声音等。样式
资源文件用于确定网页内容的样式。示例性的，样式资源文件可以用于设置网页中的标题字体、字体颜色、为标题加入背景文字等。可选的，网页结构文件为HTML(Hyper Text Markup Language，超文本标记语言)文件，样式资源文件为CSS(Cascading Style Sheets，层叠样式表)文件。可选的，样式资源文件的数量为多个，样式资源文件的具体数量在这里不作限定，具体根据实际情况确定。
[0030]确定与网页结构文件关联的多个样式资源文件，具体的，确定用于设置网页结构文件中页面元素样式的多个样式资源文件。
[0031]S120、将多个所述样式资源文件分别转换为样式资源函数，所述样式资源函数包括样式标识参数，所述样式标识参数用于唯一确定所述样式资源函数。
[0032]网页结构文件与样式资源文件之间为一对多的对应关系，也就是说，一个网页结构文件可以关联多个样式资源文件。将与网页结构关联的多个样式资源文件，分别进行格式转换，将样式资源文件转换为样式资源函数。样式资源文件与样式资源函数一一对应，也就是说，每个样式资源文件均存在与之对应的样式资源函数。示例性的，在样式资源文件为CSS文件的情况下，样式资源函数为JS函数。
[0033]样式资源函数包括至少一个函数调用参数。可选的，函数调用参数为样式标识参数。基于样式标本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种网页渲染方法，其特征在于，所述方法包括：确定与网页结构文件关联的多个样式资源文件；将多个所述样式资源文件分别转换为样式资源函数，所述样式资源函数包括样式标识参数，所述样式标识参数用于唯一确定所述样式资源函数；基于所述样式标识参数调用所述样式资源函数，设置所述网页结构文件中的网页元素样式。2.根据权利要求1所述的方法，其特征在于，将多个所述样式资源文件分别转换为样式资源函数，包括：确定多个所述样式资源文件之间的依赖关系；基于所述依赖关系，确定所述样式资源文件的文件类型，所述文件类型包括：基础样式文件和衍生样式文件；根据所述文件类型，将所述样式资源文件转换为所述样式资源函数；所述样式资源函数包括基础样式函数和衍生样式函数。3.根据权利要求2所述的方法，其特征在于，根据所述文件类型，将所述样式资源文件转换为所述样式资源函数，包括：若所述文件类型为基础样式文件，则将所述样式资源文件转换为基础样式函数。4.根据权利要求2所述的方法，其特征在于，根据所述文件类型，将所述样式资源文件转换为所述样式资源函数，包括：若所述文件类型为衍生样式文件，则确定所述衍生样式文件依赖的基础样式文件；根据所述衍生样式文件和所述基础样式文件之间的依赖关系，确定函数引用关系；根据基础样式函数和所述函数引用关系，将所述衍生样式文件转换为衍生样式函数；其中，所述基础样式函数由所述基础样式文件转换得到。5.根据权利要求4所述的方法，其特征在于，根据基础样式函数和所述函数引用关系，将所述衍生样式文件转换为衍生样式函数，包括：根据所述基础样式函数和所述函数引用关系，确定所述衍生样式函数的函数引用...

【专利技术属性】
技术研发人员：农有宝，
申请(专利权)人：杭州涂鸦信息技术有限公司，
类型：发明
国别省市：