Jquery 选择一组元素的最有效方法

例如，如果我有一个无序的列表

<ul>
    <li class="foo">Foo</li>
    <li class="bar">Bar</li>
</ul>

我可以将foo选择为$'ul li.foo'、$'li.foo'或$'.foo'

那么哪种方法更有效，如果有的话，为什么。或者，在选择子元素时指定父元素仅仅是为了在其他元素具有相同类名的情况下消除任何冲突

简单的类选择器.foo在现代浏览器中速度最快，因为它可以在可用的地方使用本机

这是一个确切的展示：

您可以在所有与您相关的浏览器中运行该性能测试，并根据测试结果做出决定。或者只使用最适合您的情况的选择器，因为在现实世界中，它不会产生任何明显的差异

更新

现在，我们可以看到更多浏览器的性能结果，您可以看到IE7和IE8中缺少getElementsByClassName的新旧浏览器之间的区别。然而，这些天来，你可能会从更新的浏览器收到更多的流量，但我不知道你的网站，所以正如我前面提到的，你只需要选择适合你的。无论出于何种原因，如果90%的流量来自IE7，那么您可能应该使用li.foo。

.foo是现代浏览器中速度最快的选择器。其他选择器将选择.foo，然后过滤掉任何不是li的内容，然后对$'ul li.doo'在树中进行迭代，确保某个地方有一个ul

但是，在没有和的旧浏览器中，foo不会是最快的。比如IE6

如果您知道页面上只有一个foo，那么最快的方法就是使用id并执行$'foo'

---

取决于所涉及的操作系统/浏览器/版本，以及哪个jQuery版本。你关心哪些？此外，这闻起来是最好的。最好使用ID选择元素，在您的情况下，您可以为UL添加ID。否则，可能会有多个元素具有相同的类和层次结构。@Phrogz这只是出于好奇。另外，您提到这取决于操作系统/浏览器/版本。你能再详细一点吗@例如，srijan一些较旧的浏览器不支持GetElementsByCassName，因此本地查找的好处将丢失；但是，如果这些浏览器都有getElementsByTagName，那么首先按标记选择，然后按类缩减可能比选择所有元素，然后缩减未测试的元素要快。例如：查看性能测试页面中的IE7和IE8结果。这很好。凭直觉，我认为追踪元素的开销会更小。谢谢你的详细说明。这真的很有帮助。@srijan-没问题，很高兴我能帮上忙：当你对各种JavaScript代码片段的性能有疑问时，它是一个很棒的工具。