jquery选择器使用data-的性能如何?

$('[data-key="vaule"]')

在jQuery中,此类方法相较于id、class在效率上有何区别?

阅读 26.4k
4 个回答

无论什么选择器,美刀这个函数都很重,都应该把结果暂存下来复用

关于选择器本身的速度,理论上来说现代浏览器的情况下(也就是委托给了querySelector的时候)应该是和.class相差无几,如果.class[attr=val]要快,那应该是浏览器专门为它做了优化。因为本质是一样的(遍历dom树)

其实这个问题应该是用数据说话的。我google了一下jsperf selector attribute vs cssclass果然第一条就是答案。贴个比较新的有点数据的revision

ID最快毫无疑问,然后就是浏览器确实对class做过优化,速度会比attribute快,但和ID没的比

最后要说的是,即使是用ID,美刀这个函数还是相当重,应该把结果暂存下来复用

自定义属性的属性选择器,效率应该会慢于id、class选择器。id选择器最快。

选择器使用data-自定义属性属于过滤了,应该是最慢的吧,反正肯定比基本选择器慢。

data-*属性目的不在于被作为选择器,而是在于存放数据到元素,然后可以用

elemente.dataset 取出来
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题