jQuery哪个性能更好？

Question

哪个会有更好的表现？

$('input[data-confirm],a[data-confirm],button[data-confirm]');

或

$('[data-confirm]');

显然，选择器的$('[data-confirm]')版本更灵活，这意味着jQuery必须扫描页面中的每个元素以查看它是否具有data-confirm属性。我会更好地使用课程吗？我喜欢使用data-confirm，因为我可以把它放在值中。

<input type="submit" data-confirm="Are you sure you want to do this sir?" />

Answer 1

为什么不使用类和data-confirm，这将允许您具体使用data-confirm属性来精确定位您想要的确切元素，而无需jquery查看其他所有内容。这将确保无论浏览器如何，您的定位都会更快。如果使用id而不是类，可能会再次关闭几纳秒。

Answer 2

基于http://www.componenthouse.com/article-19使用元素选择器比单独使用属性选择器要快得多（这里有关于选择器性能的讨论Good ways to improve jQuery selector performance?）。

就个人而言，我会先使用属性选择器，就像你说它更灵活一样，如果你遇到性能问题，你可以适当地检查这个选择。

Answer 3

正如@Guffa所说，这实际上取决于浏览器。使用Chrome 21.0.1180.89进行测试时，属性等于选择器稍微更快：

这是jsperf： http://jsperf.com/attrvstag 。

Answer 4

这取决于浏览器支持的内容。如果可以将选择器切换到要评估的浏览器，则要么足够快。

如果没有，第一个会更快，因为有内置函数来查找元素，可以由sizzle引擎使用。对于第二个，它必须循​​环遍历文档中的所有元素。