jQuery 选择器比较文章答案

【问题标题】：jQuery Selector Comparison ArticlesjQuery 选择器比较文章
【发布时间】：2009-08-05 07:05:25
【问题描述】：

我正在审查一些 jQuery 函数，它们具有各种 id 选择实现。我想尝试并标准化一种最佳实践方法，但在此之前，我想确保我选择最有效的方法。

有没有人有好的文章链接（例如this one）可以比较jQuery中不同类型的选择？

具体来说，我比较喜欢$("#id")、$("#id[type=form_input_type]")、$("#id .class") 等。

其实，更具体的说，我的首要任务是比较：

$('input[id$="mySelectionID"]')

反对

$('input:checkbox')

两者都将返回相同的复选框。我的直觉是第二个更快，但我需要确定。

【问题讨论】：

最好的方法是测试它。在 Firefox 和 Firebug 中使用分析器和 console.profile('test1') & console.profileEnd() 包裹在选择器周围很容易
另外，$('input[id$="mySelectionID"]') 和 $('input:checkbox') 仅在您只有以该值结尾的复选框时才会返回相同的集合跨度>
复选框确实有以该值结尾的 id。它们都遵循相同的命名约定。

【解决方案1】：

在您的示例中，您使用 ID 选择器：

$("#id"), $("#id[type=form_input_type]"), $("#id .class")

一个元素id必须是唯一的，如果你使用id selector，你就不需要再指定了，因为它匹配单个元素和给定的id属性。

查看这篇关于 jQuery 选择器性能的文章：

【讨论】：

【解决方案2】：

Slickspeed 给出了跨多个 js 库的选择器的各种性能数据。

This 测试只是比较各种 jQuery 版本。

Resig 先生有一篇关于选择器的有趣帖子 here。

【讨论】：

【解决方案3】：

好吧，对于选择 ID，$("#id") 将始终是最有效的，因为它直接调用 document.getElementById() 而没有额外的方法调用。其他任何事情都需要 jQuery 方面的更多工作（例如类选择）。

【讨论】：

是的，实际上我可能不应该提到那个。 ID 总是最快的——这是我主要感兴趣的其他人之间的比较。有些事情做起来很慢（比如按班级选择），但不太明显的事情是我真正想要的。