如何使用PHP计算DOM节点的有效CSS

给定一个HTML和CSS文件，如何计算哪些样式应用于节点？样式可以直接应用（例如#bar）或间接应用（例如#foo li）

，因为应用的CSS取决于节点在树中的位置（例如#foo>li仅适用于带有标记名li的#foo的直接后代），首先必须将CSS中的每个规则与DOM匹配，然后为每个节点计算生成的CSS，记住每个选择器的重量。 我不确定计算CSS权重的确切公式，但它类似于

id选择器的数量

*100+

类选择器的数量

*10+

标记选择器的数量

。当然，您必须注意内联样式和！也很重要

对于CSS到DOM节点的映射，可以使用查询引擎，如或

---

我已经编写了概念验证脚本，它演示了第一步（将CSS映射到受每个规则影响的DOM节点）

您实际上可以读取计算的样式，而不是计算它们。使用Javascript很容易做到这一点。通过PHP，您可以使用。下面是一个随时可用的coffeescript，用于转储所有元素的计算样式：

还有一个PHP包装器，用于在命令行上执行phantomJS

---

希望这能有所帮助。

实际上，您提到的重量计算只是一个简化示例。再多的类选择器（1、10甚至100）也无法超过单个ID选择器。简化说明了一个ID选择器和一个元素选择器（=101）的优先级高于三个类选择器（=030），但如果您发现自己的计数是两位数，那么这个示例就不够了。这只是一个问题或优先事项；ID定义最多的选择器获胜。如果它们相等，那么类选择器才重要。