在渲染网页和应用样式时,浏览器会对ID和类名进行索引以进行有效搜索,或者每次指定ID或类名以到达正确的元素时,它都会从顶部遍历整个DOM.
我想知道出于优化的原因,以及是否值得将浏览器提示(更长的选择器)提供给某个ID的对象所在的位置.即
#container #one-of-many-container-siblings #my-id
代替：
#my-id
如果DOM非常大,前者会产生更好的性能吗？
解决方法
它实际上与您的想法相反.
请记住,浏览器从右到左解析CSS选择器.
这个：
#container #one-of-many-container-siblings #my-id
将采取更多步骤匹配比这：
#my-id
见：http://www.css-101.org/descendant-selector/go_fetch_yourself.php
考虑到你刚刚提出的问题,我建议你阅读这篇文章：
http://css-tricks.com/efficiently-rendering-css/
它将帮助您编写更有效的选择器：
#main-navigation { } /* ID (Fastest) */
body.home #page-wrap { } /* ID */
.main-navigation { } /* Class */
ul li a.current { } /* Class *
ul { } /* Tag */
ul li a { } /* Tag */
* { } /* Universal (Slowest) */
#content [title='home'] /* Universal */
