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

哪个更快,为什么? 通过$('div[data-something]')$('div.something')选择div(用于插件需求$('div.something') ? 我倾向于前者,因为它“更清洁”。

基于这个问题,我知道我不应该同时使用这两个问题。 但是我没有发现它们之间是否存在差异。

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

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

与大多数这些事情一样,您最好的选择是:

  1. 除非你发现问题,否则不要担心,并且

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

至少在Chrome 16中, 没有区别 。 但是,如果使类选择器不那么具体(例如$(".test") ),它的性能优于其他方法:

在此处输入图像描述

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

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