一种兼容主流浏览器样式的方法和调整单元技术

本发明专利技术属于计算机技术领域，公开了一种兼容主流浏览器样式的方法，包括依次进行的如下步骤：步骤1：解析页面源代码，获取页面源代码中基于ECMAScript 6标准的样式的信息；步骤2：选择需要针对不同浏览器进行兼容的样式的属性；步骤3：对步骤2所选择的样式补充针对不同浏览器的标识符，得到多个与各浏览器一一对应的带标识符的样式；步骤4：根据浏览器的页面的预设规格，调整对应的样式中的属性的值。该方法通过对源代码解析，采用对代码规则的筛选、属性的预先选择、增设标识符来进行样式的属性的智能化调整，有效的降低了人工参与度。同时，本发明专利技术还公开了基于该方法的调整单元。本发明专利技术还公开了基于该方法的调整单元。本发明专利技术还公开了基于该方法的调整单元。

【技术实现步骤摘要】
一种兼容主流浏览器样式的方法和调整单元


[0001]本专利技术涉及计算机领域，具体为一种兼容主流浏览器样式的方法和调整单元。

技术介绍

[0002]所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。现有的解决方案大多是通过大量的代码来实现多个浏览器的样式兼容。
[0003]CN201410314265.9公开了一种浏览器兼容性检测方法和系统，其中浏览器兼容性检测方法包括以下步骤：S1：提供待检测的源代码文件及自定义配置文件；S2：根据所述自定义配置文件的内容，对所述待检测的源代码文件和检测规则文件进行预处理，标记不进行检测的源代码文件和不检测的规则文件；S3：根据预处理后的结果，将需要检测的源代码文件中的源代码与规则库中需要检测的全部规则文件中的检测规则进行一一比对，找出兼容性问题并保存检测结果；S4：读取检测结果及针对检测到兼容性问题的预先处理方案，生成报表。该方案仅仅给出了源代码针对浏览器不兼容的检测方法，其只是一种不兼容的检测方法的实现方案之一，其并不涉及适配性问题的解决、更为精确性的兼容性问题的发现、浏览器样式的统一性的实现。
[0004]现有技术问题:
[0005]1、不同浏览器对样式的差异很大，每个系统都需要适配不同的浏览器，需要花费大量的时间去做重复的适配工作。
[0006]2、随着互联网的发展，各行各业所使用的浏览器差异较大，开发人员做适配无法做到面面俱到，很多时候依赖客户或团队内测试同事的反馈来进行适配，效率不是特别高。
[0007]3、样式的实现方式多种多样，无法实现统一，无法完全的做到统一。

技术实现思路

[0008]本专利技术的目的在于提供一种兼容主流浏览器样式的方法，该方法通过对源代码解析，采用对代码规则的筛选、属性的预先选择、增设标识符来进行样式的属性的智能化调整，有效的降低了人工参与度。
[0009]同时，本专利技术还公开了基于该方法的调整单元。
[0010]为实现上述目的，本专利技术提供如下技术方案：一种兼容主流浏览器样式的方法，包括依次进行的如下步骤：
[0011]步骤1：解析页面源代码，获取页面源代码中基于ECMAScript 6标准的样式的信息，所述样式的信息包括样式的属性、值；
[0012]步骤2：选择需要针对不同浏览器进行兼容的样式的属性；
[0013]步骤3：对步骤2所选择的样式补充针对不同浏览器的标识符，得到多个与各浏览器一一对应的带标识符的样式；
[0014]步骤4：根据浏览器的页面的预设规格，调整对应的样式中的属性的值。
[0015]在上述的兼容主流浏览器样式的方法中，所述步骤2具体为：
[0016]步骤21：预先设定需要兼容的样式的属性；
[0017]步骤22：根据步骤21中所预设的属性，获取步骤1中相同的属性，确定含该属性的样式为需要兼容的样式。
[0018]在上述的兼容主流浏览器样式的方法中，所述步骤4具体为：预先获取各浏览器的需要兼容的样式中的属性的值，将该值与源代码中对应属性值的差值作为调整后的属性的值。
[0019]在上述的兼容主流浏览器样式的方法中，还包括步骤5：
[0020]对源代码中所有需要兼容的样式的属性进行调整后，对调整后的源代码打包。
[0021]在上述的兼容主流浏览器样式的方法中，所述步骤5中，在打包过程之前或打包过程中，对源代码进行书写规范的检测，如果检测得到不符合书写规范的地方，以自动修改或弹出提醒并手工修改的方式进行调整。
[0022]同时，本专利技术还公开了一种主流浏览器源代码自动调整单元，包括如下模块：
[0023]源代码解析模块：用于解析页面源代码，获取页面源代码中基于ECMAScript 6标准的样式的信息，所述样式的信息包括样式的属性、值；
[0024]属性选择模块：用于选择需要针对不同浏览器进行兼容的样式的属性；
[0025]标识符补充模块：用于对属性选择模块所选择的样式补充针对不同浏览器的标识符，得到多个与各浏览器一一对应的带标识符的样式；
[0026]值修改模块：用于根据浏览器的页面的预设规格，调整标识符补充模块生成的样式的属性的值。
[0027]在上述的主流浏览器源代码自动调整单元中，还包括打包模块：用于对源代码中所有需要兼容的样式的属性进行调整后，对调整后的源代码打包。
[0028]在上述的主流浏览器源代码自动调整单元中，所述打包模块还用于在打包过程之前或打包过程中，对源代码进行书写规范的检测，如果检测得到不符合书写规范的地方，以自动修改或弹出提醒并手工修改的方式进行调整。
[0029]与现有技术相比，本专利技术的有益效果是：
[0030]本专利技术的方法通过对源代码解析，采用对代码规则的筛选、属性的预先选择、增设标识符来进行样式的属性的智能化调整，有效的降低了人工参与度，智能化程度高，同时通过本专利技术的方法可以使各浏览器达到一致的展现方式。
附图说明
[0031]图1为本专利技术的实施例1的流程框图；
[0032]图2为本专利技术的实施例2的结构框图。
具体实施方式
[0033]下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他
实施例，都属于本专利技术保护的范围。
[0034]实施例1
[0035]参考图1，一种兼容主流浏览器样式的方法，包括依次进行的如下步骤：
[0036]步骤1：解析页面源代码，获取页面源代码中基于ECMAScript 6标准的样式的信息，所述样式的信息包括样式的属性、值；
[0037]源代码内的代码可以采用不同的标准来实现，比如类似于es5等通过了w3c认证的规则，但是es6中的新规则大多没有通过w3c认证，每个浏览器针对这些规则没有统一的标准且各个浏览器针对这些规则都有其自己的标准，这是本案兼容的需求来源。
[0038]以代码为例：transform:rotate(30deg)
[0039]rotate代表属性，值为30deg。
[0040]在源代码中，如果不作本步骤的解析处理，按照ECMAScript 6标准的代码为transform:rotate(30deg)，其无法获知是否需要调整以及如何去调整。
[0041]步骤2：选择需要针对不同浏览器进行兼容的样式的属性；
[0042]在进行本专利技术的方法之前，开发人员会规定某些属性是需要调整的，比如页面的宽度需要兼容适配不同的浏览器，或者3D或2D样式的旋转等。
[0043]步骤2具体来说为：
[0044]步骤21：预先设定本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种兼容主流浏览器样式的方法，其特征在于，包括依次进行的如下步骤：步骤1：解析页面源代码，获取页面源代码中基于ECMAScript 6标准的样式的信息，所述样式的信息包括样式的属性、值；步骤2：选择需要针对不同浏览器进行兼容的样式的属性；步骤3：对步骤2所选择的样式补充针对不同浏览器的标识符，得到多个与各浏览器一一对应的带标识符的样式；步骤4：根据浏览器的页面的预设规格，调整对应的样式中的属性的值。2.根据权利要求1所述的兼容主流浏览器样式的方法，其特征在于，所述步骤2具体为：步骤21：预先设定需要兼容的样式的属性；步骤22：根据步骤21中所预设的属性，获取步骤1中相同的属性，确定含该属性的样式为需要兼容的样式。3.根据权利要求1所述的兼容主流浏览器样式的方法，其特征在于，所述步骤4具体为：预先获取各浏览器的需要兼容的样式中的属性的值，将该值与源代码中对应属性值的差值作为调整后的属性的值。4.根据权利要求1所述的兼容主流浏览器样式的方法，其特征在于，还包括步骤5：对源代码中所有需要兼容的样式的属性进行调整后，对调整后的源代码打包。5.根据权利要求4所述的兼容主流浏览器样式的方法，其特征...

【专利技术属性】
技术研发人员：李玥，曹连峰，陶洋，何奎，
申请(专利权)人：广州鲁邦通智能科技有限公司，
类型：发明
国别省市：