测验

解释浏览器如何确定哪些元素与 CSS 选择器匹配。

主题
浏览器CSS
在GitHub上编辑

这个问题与关于 编写高效 CSS 的问题相关。浏览器从最右侧(关键选择器)到左侧匹配选择器。浏览器根据关键选择器过滤 DOM 中的元素,并向上遍历其父元素以确定匹配项。选择器链的长度越短,浏览器确定该元素是否与选择器匹配的速度就越快。

例如,对于选择器 p span,浏览器首先找到所有 <span> 元素,并向上遍历其父元素,直到根元素,以找到 <p> 元素。对于特定的 <span>,一旦找到 <p>,它就知道 <span> 与选择器匹配,并且可以停止遍历其父元素。

在GitHub上编辑