哪个jQuery选择器更有效？

Question

我只是想知道我是否应该选择这个

<div class="identifying-class">bla bla</div>
<div class="identifying-class">bla bla</div>
var interestingElements = $("div.identifying-class);

这个

<div data-identifying-attr="true">bla bla</div>
<div data-identifying-attr="true">bla bla</div>
var interestingElements = $("div[data-identifying-attr]");

基于属性的选择器是否比基于类的选择器更快/更慢/更快？ 一种方法被认为比另一种方法更好 - 如果是这样，为什么？

Answer 1

这方面没有明显的性能问题。但class="identifying-class"更具可读性。你可以在http://sizzlejs.com/深入挖掘。 Sizzle是jQuery使用的css选择器引擎。

Answer 2

类选择器会更快（在现代浏览器中使用getElementsByClassName，并且很可能在较旧的浏览器中）。以下是quick test：

的结果

请注意，我只在Chrome 15上运行。其他浏览器可能略有不同但结果应该相似。另请注意，在现实世界中，这不太可能对性能产生任何影响。 2之间的差异只有19％（尽管事实上它在图表上看起来有很大差异）。

Answer 3

我的2c：

对于今天的超高速和内存膨胀的工作站（也就是个人计算机），性能差异的纳秒不再是问题。因此，假设（我从未使用过数据识别功能）两种解决方案都可以工作，这取决于编码器使用哪种解决方案。

我全都是为了“自我认同”，我用个人触摸编码的越多，我感觉越好。我尽我所能让任何人理解我的代码，但会有个人风格，如果我的个人风格可以实现的解决方案有任何变化，我会这样做！