css - 在 css 中使用 starts with selector 是否有效？

Question

在 css 中使用 starts with selector 是否正确？

HTML

<div id="row_1">
..
</div>
<div id="row_2">
..
</div>

CSS

div[id^='row']  {
 ...
}

它似乎适用于最新的浏览器，但我不确定这是否允许或 w3c 推荐。
我希望了解这一点以学习最佳实践。

Answer 1

这些属性选择器是完全有效的。他们是part of CSS Selectors Level 3 spec ，自 2011 年以来一直是 W3C 推荐标准。

但是，这些选择器的性能不是很好(例如使用 div[id^='row'] 浏览器将为每个 div 执行属性检查，包括字符串比较操作 页面上的元素)。使用类应该是更通用的方法，因为使用 id 作为样式 Hook 根本不是最好的主意。