javascript - 是否应该通过ID/类名或数据属性选择DOM元素？

一位同事建议更改我们的完整JavaScript代码，以仅通过数据属性而不是ID /类名来选择DOM元素。

他说，这很糟糕:

$('#foo')
$('.bar')

这很好:

$('[data-foo]')

我不知道这样做有什么好处，所以我在Google上搜索了一下，发现了这两篇博客文章:

相反的数据属性:http://intuio.at/en/blog/dont-use-data-attributes-to-find-html-elements-with-js/

专业版:http://roytomeij.com/blog/2012/dont-use-class-names-to-find-HTML-elements-with-JS.html

由于这些博客文章只是两个开发人员的意见，因此我想知道实际的实践经验是什么？使用数据属性进行DOM选择真的有好处吗？还是一个愚蠢的主意？

最佳答案

$('#foo')最快，但是具有id的ID只能有一个元素
$('.bar')比数据属性更快，但是比较困惑，因为class通常与CSS样式相关联
$('[data-foo]')是最慢的(略微)，但最不可能干扰其他操作

速度测试-http://jsperf.com/data-selector-performance