样式确定方法及装置制造方法及图纸

技术编号:20745536 阅读:29 留言:0更新日期:2019-04-03 10:27
本公开是关于样式确定方法及装置。该方法包括:在创建视图模型实例的目标节点之后,确定目标节点所依赖的目标样式信息对象;目标样式信息对象包括:CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各样式规则的优先级分数、及各CSS后代选择器的索引信息;根据各CSS后代选择器的索引信息,确定目标节点匹配的样式规则;根据各样式规则的优先级分数,将目标节点匹配的各样式规则进行合并,确定目标节点的样式。本公开通过支持后代选择器,能够帮助开发者提高开发效率,实现简单,开发和维护成本低,通过在样式信息对象中保存各CSS后代选择器的索引信息,能够提升样式规则匹配效率,提升应用性能,提高用户体验。

【技术实现步骤摘要】
样式确定方法及装置
本公开涉及终端
,尤其涉及样式确定方法及装置。
技术介绍
随着智能终端技术的发展,出现了众多基于移动端、个人计算机(PC,PersonalComputer)端的开发平台以及操作系统。而为了将同一款应用推广至不同平台和操作系统,开发者需要针对不同平台和操作系统分别开发不同的版本,造成开发成本过高,维护工作量过大。鉴于此,设备商推出了诸如快应用平台等能够提供应用秒开功能的统一平台,为用户提供无需下载安装就可以立即使用应用的服务;快应用是基于终端硬件平台的新型应用形态,是一套以前端开发技术栈为主进行应用开发的框架,采用流行的前端开发模式,同时大幅提升应用性能,提供大量前端环境无法使用的系统能力和很多第三方服务的对接能力;基于快应用平台,开发者仅需编写一套代码,快应用可以运行于Android、IOS、Webview等不同开发平台和操作系统,并且开发者可以通过以编写传统html类似的语言方式来编写快应用,能够降低开发者对代码的开发成本,减少维护工作量。相关技术中,当前主流浏览器都支持层叠样式表(CSS,CascadingStyleSheets)后代选择器,并且支持很多的选择器和功能,例如包括通配符、及样式继承等。
技术实现思路
为克服相关技术中存在的问题,本公开实施例提供一种样式确定方法及装置。所述技术方案如下:根据本公开实施例的第一方面,提供一种样式确定方法,方法包括:在创建视图模型实例的目标节点之后,确定所述目标节点所依赖的目标样式信息对象;所述目标样式信息对象包括:层叠样式表CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各所述样式规则的优先级分数、及各所述CSS后代选择器的索引信息;各所述CSS后代选择器的索引信息,用于记录将各所述CSS后代选择器按照CSS后代选择器的名称中最后一个基础选择器的名称进行分类后得到的分类结果;根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则;根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式。本公开的实施例提供的技术方案可以包括以下有益效果:该技术方案通过支持后代选择器,能够帮助开发者提高开发效率,实现简单,开发和维护成本低,通过在样式信息对象中保存各CSS后代选择器的索引信息,能够提升样式规则匹配效率,提升应用性能,提高用户体验。在一个实施例中,所述方法还包括:当创建所述视图模型实例的根节点时,编译样式代码,生成待注册样式信息对象;在页面的文档上注册所述待注册样式信息对象;在所述视图模型实例的根节点上绑定所述待注册样式信息对象的标识。在一个实施例中,所述确定所述目标节点所依赖的目标样式信息对象,包括:获取所述目标节点所属的文档上注册的样式信息对象的集合;获取所述目标节点所属的视图模型实例的根节点上绑定的样式信息对象的标识;根据所获取的样式信息对象的集合、及所获取的样式信息对象的标识,确定所述目标节点所依赖的目标样式信息对象。在一个实施例中,所述根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则,包括:在所述目标样式信息对象所包括的各CSS基础选择器对应的样式规则中,查找所述目标节点匹配的第一CSS基础选择器;在所述目标样式信息对象所包括的各所述CSS后代选择器的索引信息中,查找所述目标节点匹配的第二CSS基础选择器、及以所述第二CSS基础选择器的名称为索引的第一CSS后代选择器;获取所述目标节点的所有父节点;分别根据各所述父节点查找各所述第一CSS后代选择器中与所述目标节点匹配的第二CSS后代选择器;根据所述第一CSS基础选择器和所述第二CSS后代选择器,确定所述目标节点匹配的样式规则。在一个实施例中,所述方法还包括:将所确定的所述目标节点匹配的样式规则,按照样式规则的不同类别分类缓存至所述目标节点中。在一个实施例中,所述根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式,包括:按照所述目标节点所匹配的各所述样式规则的优先级分数由小到大的顺序,将各所述样式规则进行排序;通过优先级分数大的样式规则覆盖优先级分数小的样式规则,将排序后各所述样式规则进行合并,得到所述目标节点的样式。根据本公开实施例的第二方面,提供一种样式确定装置,包括:目标样式信息对象确定模块,用于在创建视图模型实例的目标节点之后,确定所述目标节点所依赖的目标样式信息对象;所述目标样式信息对象包括:层叠样式表CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各所述样式规则的优先级分数、及各所述CSS后代选择器的索引信息;各所述CSS后代选择器的索引信息,用于记录将各所述CSS后代选择器按照CSS后代选择器的名称中最后一个基础选择器的名称进行分类后得到的分类结果;样式规则确定模块,用于根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则;样式确定模块,用于根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式。在一个实施例中,所述装置还包括:生成模块,用于当创建所述视图模型实例的根节点时,编译样式代码,生成待注册样式信息对象;注册模块,用于在页面的文档上注册所述待注册样式信息对象;绑定模块,用于在所述视图模型实例的根节点上绑定所述待注册样式信息对象的标识。在一个实施例中,所述目标样式信息对象确定模块,包括:第一获取子模块,用于获取所述目标节点所属的文档上注册的样式信息对象的集合;第二获取子模块,用于获取所述目标节点所属的视图模型实例的根节点上绑定的样式信息对象的标识;第一确定子模块,用于根据所获取的样式信息对象的集合、及所获取的样式信息对象的标识,确定所述目标节点所依赖的目标样式信息对象。在一个实施例中,所述样式规则确定模块,包括:第一查找子模块,用于在所述目标样式信息对象所包括的各CSS基础选择器对应的样式规则中,查找所述目标节点匹配的第一CSS基础选择器;第二查找子模块,用于在所述目标样式信息对象所包括的各所述CSS后代选择器的索引信息中,查找所述目标节点匹配的第二CSS基础选择器、及以所述第二CSS基础选择器的名称为索引的第一CSS后代选择器;第三获取子模块,用于获取所述目标节点的所有父节点;匹配子模块,用于分别根据各所述父节点查找各所述第一CSS后代选择器中与所述目标节点匹配的第二CSS后代选择器;第二确定子模块,用于根据所述第一CSS基础选择器和所述第二CSS后代选择器,确定所述目标节点匹配的样式规则。在一个实施例中,所述装置还包括:缓存模块,用于将所确定的所述目标节点匹配的样式规则,按照样式规则的不同类别分类缓存至所述目标节点中。在一个实施例中,所述样式确定模块,包括:排序子模块,用于按照所述目标节点所匹配的各所述样式规则的优先级分数由小到大的顺序,将各所述样式规则进行排序;合并子模块,用于通过优先级分数大的样式规则覆盖优先级分数小的样式规则,将排序后各所述样式规则进行合并,得到所述目标节点的样式。根据本公开实施例的第本文档来自技高网...

【技术保护点】
1.一种样式确定方法,其特征在于,包括:在创建视图模型实例的目标节点之后,确定所述目标节点所依赖的目标样式信息对象;所述目标样式信息对象包括:层叠样式表CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各所述样式规则的优先级分数、及各所述CSS后代选择器的索引信息;各所述CSS后代选择器的索引信息,用于记录将各所述CSS后代选择器按照CSS后代选择器的名称中最后一个基础选择器的名称进行分类后得到的分类结果;根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则;根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式。

【技术特征摘要】
1.一种样式确定方法,其特征在于,包括:在创建视图模型实例的目标节点之后,确定所述目标节点所依赖的目标样式信息对象;所述目标样式信息对象包括:层叠样式表CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各所述样式规则的优先级分数、及各所述CSS后代选择器的索引信息;各所述CSS后代选择器的索引信息,用于记录将各所述CSS后代选择器按照CSS后代选择器的名称中最后一个基础选择器的名称进行分类后得到的分类结果;根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则;根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式。2.根据权利要求1所述的方法,其特征在于,所述方法还包括:当创建所述视图模型实例的根节点时,编译样式代码,生成待注册样式信息对象;在页面的文档上注册所述待注册样式信息对象;在所述视图模型实例的根节点上绑定所述待注册样式信息对象的标识。3.根据权利要求1所述的方法,其特征在于,所述确定所述目标节点所依赖的目标样式信息对象,包括:获取所述目标节点所属的文档上注册的样式信息对象的集合;获取所述目标节点所属的视图模型实例的根节点上绑定的样式信息对象的标识;根据所获取的样式信息对象的集合、及所获取的样式信息对象的标识,确定所述目标节点所依赖的目标样式信息对象。4.根据权利要求1所述的方法,其特征在于,所述根据所述目标样式信息对象中各所述CSS后代选择器的索引信息,确定所述目标节点匹配的样式规则,包括:在所述目标样式信息对象所包括的各CSS基础选择器对应的样式规则中,查找所述目标节点匹配的第一CSS基础选择器;在所述目标样式信息对象所包括的各所述CSS后代选择器的索引信息中,查找所述目标节点匹配的第二CSS基础选择器、及以所述第二CSS基础选择器的名称为索引的第一CSS后代选择器;获取所述目标节点的所有父节点;分别根据各所述父节点查找各所述第一CSS后代选择器中与所述目标节点匹配的第二CSS后代选择器;根据所述第一CSS基础选择器和所述第二CSS后代选择器,确定所述目标节点匹配的样式规则。5.根据权利要求4所述的方法,其特征在于,所述方法还包括:将所确定的所述目标节点匹配的样式规则,按照样式规则的不同类别分类缓存至所述目标节点中。6.根据权利要求1所述的方法,其特征在于,所述根据所述目标节点所匹配的各所述样式规则的优先级分数,将所述目标节点匹配的各所述样式规则进行合并,确定所述目标节点的样式,包括:按照所述目标节点所匹配的各所述样式规则的优先级分数由小到大的顺序,将各所述样式规则进行排序;通过优先级分数大的样式规则覆盖优先级分数小的样式规则,将排序后各所述样式规则进行合并,得到所述目标节点的样式。7.一种样式确定装置,其特征在于,包括:目标样式信息对象确定模块,用于在创建视图模型实例的目标节点之后,确定所述目标节点所依赖的目标样式信息对象;所述目标样式信息对象包括:层叠样式表CSS基础选择器对应的样式规则、CSS后代选择器对应的样式规则、各所述样式规则的优先级分数、及各所述CSS后代选择器的索引信息;各所述CSS后代选择器的索引信息,用于记录将各所述CSS后代选择器按照CSS后代选择器的名称中最后一个基础选择器的名称进行分类后得到的分类结果;样式规则确定模块,用于根...

【专利技术属性】
技术研发人员:董永清杨亮余鹏沈妮
申请(专利权)人:北京小米移动软件有限公司
类型:发明
国别省市:北京,11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1