用正则表达式解析css

Question

我想扫描一个css文件并捕获注释和CSS.我已经提出了一个几乎存在的正则表达式,但它并不完美,因为它错过了具有多个声明的属性,即

ul.menu li a, # Won't capture this line
ul.nice-menu li a { text-decoration: none; cursor:pointer; }

这是我正在使用的正则表达式:

(\/\*[^.]+\*\/\n+)?([\t]*[a-zA-Z0-9\.# -_:@]+[\t\s]*\{[^}]+\})

我一直在rubular.com上测试这个,这是它目前匹配的,以及数组输出是什么样的.

结果1

[0] /* Index */
/*
GENERAL

PAGE REGIONS
- Header bar region
- Navigation bar region
- Footer region           
SECTION SPECIFIC
- Homepage
- News */

[1] html { background: #ddd; }

结果2

[0]
[1] body { background: #FFF; font-family: "Arial", "Verdana", sans-serif; color: #545454;}

我必须指出,当谈到正则表达式时,我仍然是一个新手,所以如果有人可以帮助并显示我出错的地方,那就非常感激:)

顺便说一句:我正在使用PHP和preg_match_all

Answer 1

CSS无法使用正则表达式进行完全解析(请参阅CSS语法:http://www.w3.org/TR/CSS2/grammar.html).例如,{...}可以在行上拆分,并且您当前的版本不会处理此问题.如果您需要这样做,您应该阅读CSS规范并使用像ANTLR这样的工具来生成解析器.

以下是W3C规范(http://www.w3.org/TR/CSS2/syndata.html)的示例:

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }

没有正常的正则表达式足以处理嵌套的{...}等等,更不用说导入的样式表的内容了.