生成级联样式表代码的方法及装置的制造方法

文档序号:9375327阅读:245来源:国知局
生成级联样式表代码的方法及装置的制造方法
【技术领域】
[0001] 本公开涉及计算机技术领域,特别涉及一种生成级联样式表代码的方法及装置。
【背景技术】
[0002] CSS (Cascading Style Sheets,级联样式表)是一种样式设计语言,相对于传统 HTML(Hyper Text Markup Language,超级文本标记语言)的表现而言,CSS能够对网页中 的对象的位置排版进行像素级的精确控制,做到网页表现与内容分离。
[0003] 编程人员在编写CSS代码时,需要根据CSS语言本身的编写规则,对网页中各对象 样式的各种属性逐一的进行描述。例如:设置头部对象中的颜色为白色,字体为Hpx ;设置 主体对象中的颜色为白色,字体为14px。则相应的代码为:
[0004] Sheader {
[0005] color:#FFF ;
[0006] font-size: 14px ;}
[0007] #body {
[0008] color:#FFF ;
[0009] font-size: 14px ;}
[0010] 编程人员在后期修改或维护代码时,则需要针对各对象中的各属性逐一的进行修 改。

【发明内容】

[0011] 为了解决相关技术的问题,本公开实施例提供了一种生成级联样式表代码的方法 及装置。所述技术方案如下:
[0012] 根据本公开实施例的第一方面,提供一种生成级联样式表代码的方法,包括:
[0013] 获取待编译的级联样式表CSS代码,所述待编译的CSS代码中包括声明代码以及 样式描述代码;
[0014] 根据所述声明代码以及所述声明代码对应的代码编译规则对所述样式描述代码 进行编译,生成所述样式描述代码对应的原生CSS代码。
[0015] 可选的,所述根据所述声明代码以及所述声明代码对应的代码编译规则对所述样 式描述代码进行编译,生成所述样式描述代码对应的原生CSS代码,包括:
[0016] 如果在所述样式描述代码中查找到变量,则在所述声明代码中查找所述变量的变 量值;
[0017] 将所述变量的变量值替换查找到的所述变量。
[0018] 通过在样式描述代码中查找预先声明的变量,并通过预先声明的变量值替换该变 量,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的CSS代码进行维 护。
[0019] 可选的,所述将所述变量的变量值替换查找到的所述变量,包括:
[0020] 如果在包含所述变量的语句中检测到了运算式,则根据所述运算式对所述变量的 变量值进行运算;
[0021 ] 将所述运算后的变量值替换查找到的所述变量。
[0022] 通过检测包含变量的语句中的运算式,并将变量值通过运算式运算后的值替换变 量,增加了对变量的操作方式,进而在后续对CSS代码的维护过程中直接修改声明代码即 可对完整的CSS代码进行维护。
[0023] 可选的,所述根据所述声明代码以及所述声明代码对应的代码编译规则对所述样 式描述代码进行编译,生成所述样式描述代码对应的原生CSS代码,包括:
[0024] 如果所述样式描述代码中查找到函数,则在所述声明代码中查找所述函数的函数 体;
[0025] 检测所述函数中是否携带自定义函数变量值;
[0026] 如果所述函数中未携带自定义函数变量值,则将所述函数的函数体替换所述函 数,并使用所述函数的默认函数变量值;
[0027] 如果所述函数中携带自定义函数变量值,则将所述函数的函数体替换所述函数, 并将所述自定义函数变量值替换所述函数的函数体中的默认函数变量值。
[0028] 通过在样式描述代码中查找预先声明的函数,并通过预先声明的函数体替换该函 数,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的CSS代码进行维 护。
[0029] 可选的,所述根据所述声明代码以及所述声明代码对应的代码编译规则对所述样 式描述代码进行编译,生成所述样式描述代码对应的原生CSS代码,包括:
[0030] 如果所述样式描述代码中查找到继承类的对象,则在所述声明代码中查找所述类 的类体内容;
[0031] 将所述类的类体内容添加入继承所述类的对象中。
[0032] 通过在样式描述代码中查找预先声明的类,并通过预先声明的类的类体内容添加 入继承类的对象中,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的 CSS代码进行维护。
[0033] 可选的,所述获取待编译的级联样式表CSS代码之后,所述方法还包括:
[0034] 如果在所述声明代码中检测到导入文件的代码,则根据所述导入文件的代码中的 路径获取待导入的代码文件;
[0035] 将所述待导入的代码文件中的代码添加入所述待编译的CSS代码中。
[0036] 通过在样式描述代码中查找导入文件的代码,并在检测到导入文件的代码时根据 文件的路径将导入的代码文件的代码添加入待编译的CSS代码中;实现了代码导入的功 能,提高了编写CSS代码的效率。
[0037] 可选的,所述获取待编译的级联样式表CSS代码之后,所述方法还包括:
[0038] 如果在所述样式描述代码中检测到了嵌套格式的代码,则根据所述嵌套格式的代 码中描述的子对象以及包含所述子对象的对象,生成所述子对象的描述代码;
[0039] 删除包含所述子对象的对象中的所述嵌套格式的代码。
[0040] 通过检测样式描述代码中的嵌套格式的代码,并为嵌套格式的代码生成子对象的 描述代码,提高了编写CSS代码的效率。
[0041] 根据本公开实施例的第二方面,提供一种生成级联样式表代码的装置,包括:
[0042] 获取模块,用于获取待编译的级联样式表CSS代码,所述待编译的CSS代码中包括 声明代码以及样式描述代码;
[0043] 编译模块,用于根据所述声明代码以及所述声明代码对应的代码编译规则对所述 样式描述代码进行编译,生成所述样式描述代码对应的原生CSS代码。
[0044] 可选的,所述编译模块,包括:
[0045] 第一查找子模块,用于在所述样式描述代码中查找到变量时,在所述声明代码中 查找所述变量的变量值;
[0046] 第一替换子模块,用于将所述变量的变量值替换查找到的所述变量。
[0047] 通过在样式描述代码中查找预先声明的变量,并通过预先声明的变量值替换该变 量,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的CSS代码进行维 护。
[0048] 可选的,所述第一替换子模块用于:
[0049] 在包含所述变量的语句中检测到了运算式时,根据所述运算式对所述变量的变量 值进行运算;并将所述运算后的变量值替换查找到的所述变量。
[0050] 通过检测包含变量的语句中的运算式,并将变量值通过运算式运算后的值替换变 量,增加了对变量的操作方式,进而在后续对CSS代码的维护过程中直接修改声明代码即 可对完整的CSS代码进行维护。
[0051] 可选的,所述编译模块,包括:
[0052] 第二查找子模块,用于在所述样式描述代码中查找到函数时,在所述声明代码中 查找所述函数的函数体;
[0053] 检测子模块,用于检测所述函数中是否携带自定义函数变量值;
[0054] 第二替换子模块,用于在所述函数中未携带自定义函数变量值时,将所述函数的 函数体替换所述函数,并使用所述函数的默认函数变量值;
[0055] 第三替换子模块,用于在所述函数中携带自定义函数变量值时,将所述函数的函 数体替换所述函数,并将所述自定义函数变量值替换所述函数的函数体中的默认函数变量 值。
[0056] 通过在样式描述代码中查找预先声明的函数,并通过预先声明的函数体替换该函 数,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的CSS代码进行维 护。
[0057] 可选的,所述编译模块,包括:
[0058] 第三查找子模块,用于在所述样式描述代码中查找到继承类的对象时,在所述声 明代码中查找所述类的类体内容;
[0059] 第一添加子模块,用于将所述类的类体内容添加入继承所述类的对象中。
[0060] 通过在样式描述代码中查找预先声明的类,并通过预先声明的类的类体内容添加 入继承类的对象中,可以在后续对CSS代码的维护过程中直接修改声明代码即可对完整的 CSS代码进行维护。
[0061] 可选的,所述编译模块,还包括:
[0062] 获取子模块,用于在所述声明代码中检测到导入文件的代码时,根据所述导入文 件的代码中的路径获取待导入的代码文件;
[0063] 第二添加子模块,用于将所述待导入的代码文件中的代码添加入所述待编译的 CSS代码中。
[0064] 通过在样式描述代码中查找导入文件的代码,并在检测到导入文件的代码时根据 文件的路径将导入的代码文件的代码添加入待编译的CSS代码中;实现了代码导入的功 能,提高了编写CSS代码的效率。
[0065] 可选的,所述编译模块,还包括:
[0066] 生成子模块,用于在所述样式描述代码中检测到了嵌套格式的代码时,根据所述 嵌套格式的代码中描述的子对象以及包含所述子对象的对象,生成所述子对象的描述代 码
当前第1页1 2 3 4 5 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1