Lexing和Parsing CSS层次结构

2019年8月3日 176次阅读 
.someDiv { width:100%; height:100%; ... more properties ... }

如何在我的解析器中组成一个与上面的字符串匹配的规则？

对我来说似乎不太可能,因为你无法在规则中定义无限数量的属性？有人可以澄清一下,你会如何用FsLex和FsYacc做这样的事情？

最佳答案 如果您正在使用FsLex和FsYacc,则可以将{…}内的属性解析为属性列表.假设你有一个能够正确识别所有特殊字符的词法分析器,并且你有一个解析单个属性的规则,你可以编写如下内容：

declaration:
  | navigators LCURLY propertyList RCURLY { Declaration($1, $3) }
  | navigators LCURLY RCURLY              { Declaration($1, []) }

propertyList:
  | property SEMICOLON propertyList    { $1::$2 }
  | property                           { [$1] }

property:
  | IDENTIFIER COLON values            { Property($1, $3) }

声明规则解析整个声明(您需要为可在CSS中使用的各种导航器编写解析器,例如div.foo #id等.)propertyList规则解析一个属性,然后递归调用自身以解析多个属性.

在右侧构造的值将是表示个体属性的值列表.属性规则解析单个属性分配,例如width：100％(但您需要完成值的解析,因为它可以是列表或更强制的表达式).

点赞