jQuery性能 - 通过data-attr或类选择？

Question

哪个更快，为什么？按$('div[data-something]')或$('div.something')选择div（适用于插件需求）？我倾向于前者，因为它“更清洁”。

基于this SO question我知道我不应该同时使用两者。但是我没有发现它们之间是否存在差异。

Answer 1

至少在Chrome 16中，there is no difference。但是，如果使类选择器不那么具体（例如$(".test")），它的确优于其他方法：

这有些出乎意料，因为正如ShankarSangoli所提到的，我认为div.test类选择器会更快。

Answer 2

它会因浏览器而异。几乎所有浏览器现在都支持querySelectorAll，jQuery会尽可能使用它。 querySelectorAll可以与属性存在选择器一起使用，所以如果它在那里jQuery不必执行工作，它可以将它卸载到引擎。

对于没有querySelectorAll的旧浏览器，jQuery显然需要做更多的工作，但即使IE8也有它。

与大多数这些事情一样，最好的选择是：

1. 除非您发现问题，否则不要担心，

2. 如果您发现问题，请在您打算支持的浏览器上对其进行分析，然后做出明智的决定。

Answer 3

按类选择总是比属性选择器快，因为如果浏览器支持，jQuery会首先尝试使用本机getElementByCalssName。如果不是，它使用querySelector使用css选择器来查找页面中的元素。