CSS 伪类是否在其他选择器之前被读取？答案

【问题标题】：Do CSS pseudo classes get read before other selectors?CSS 伪类是否在其他选择器之前被读取？
【发布时间】：2014-12-06 04:34:11
【问题描述】：

CSS 从右到左读取，但伪类是在它们所附加的选择器之前还是之后读取？

例如，在：

p:first-child {}

浏览器是否匹配每个 p 元素，然后确定它是否是第一个子元素，还是匹配每个元素的每个第一个子元素，然后确定它是否是 p 元素？

我想浏览器会匹配该元素，然后确定它是否是 :first-child、:nth-child 等，但我想确定一下..

【问题讨论】：

谷歌没有答案吗？
我想您是在询问实施细节。实现真的很模糊，甚至可以在版本之间改变，如果由于某种原因性能可以提高或者代码通过选择一个而不是另一个变得更清晰。
我问了谷歌；找不到它。确实找到了几个地方说伪选择器是最慢的。 vanseodesign.com/css/css-selector-performance 但最慢并没有多大意义，除非您将 10mb 的数据表倒入视图中。
感谢 Zenorbi，我会记住这一点。还要感谢 Will，那篇文章让我对我正在寻找的东西有了一个很好的了解。您介意将您的评论变成答案吗？ @alien：不，这就是我在这里问的原因。你的评论有帮助吗？不。下次，你在发表评论时在对话中添加一些有用的东西怎么样？

【解决方案1】：

"浏览器是否匹配每个 p 元素，然后确定它是否第一个孩子，还是匹配每个元素的第一个孩子，以及判断它是否是p元素？”

两者都没有。浏览器不会寻找要应用规则的元素，它会寻找要应用到元素的规则。

在检查规则是否适用于元素时，首先检查它是p 元素还是第一个子元素并没有太大区别。两者都很容易确定。

【讨论】：

感谢您的评论，Guffa，但我不是在寻找如何确定哪些规则适用于哪些元素。我正在寻找在将样式规则与元素匹配时，是否匹配首先发生在伪类，然后是伪类的限定符，或者它是否首先查看限定符，然后是伪类。不过，我可以看到我最初的问题可能在哪里被误解。我很抱歉没有说得更清楚。
@user3633776：当涉及到每个复合选择器中的选择器时，从右到左的处理仅适用于组合器，这取决于浏览器中的实现。这取决于浏览器所做的优化，哪些选择器检查起来更快，但它对性能的影响很小。首先检查this.tagName == 'P' 或this.parent.childNodes[0] == this 的等效项的效果几乎无法衡量。
啊，我明白你的意思了。非常感谢您的澄清。