jQuery 选择器：获取子集的哪个更快？

Posted 2023-03-05

【中文标题】jQuery 选择器：获取子集的哪个更快？

【英文标题】：jQuery Selectors: Which is faster for grabbing a subset of children?

【发布时间】：2011-04-23 19:28:20

【问题描述】：

跟进this 问题，我有以下两个选择：

$("tr td").slice(3, 6);

可能是这样的（从算法上讲，我的意思是；我知道为每个元素创建新的查询字符串有点傻）：

var subset = $( "tr td:nth-child(4)" );
for(var i=4; i<7; i++) subset.add( "tr td:nth-child("+i+")" );

哪个执行效率更高？还有其他更有效的解决方案吗？

【问题讨论】：

我认为必须有人成为 jQuery 的主要贡献者才能真正能够在不检查的情况下回答这个问题。对其进行基准测试？

在我看来你会想要一个> 子选择器，所以jQuery 只寻找<td> 的直接子元素<tr>。 $("tr > td")

【参考方案1】：

第一个 ($("tr td").slice(3, 6)) 会执行得更快，因为它是一个单一的选择器引擎调用，但一如既往地测试它！

我设置了一个性能测试，因此您可以在这里自己检查这两个（和其他答案）：http://jsperf.com/slice-performance-test

【参考方案2】：

在第一个代码中，您计算​​一次$('tr td') 并获得一个切片。

在第二个代码中，您计算​​ $('tr td') 4 次，然后每次提取第 4 到第 7 个孩子。

因此第一个代码更快。事实上，它也更容易阅读。

【讨论】：

是的，但我说的是算法性能。我想我假设每个查询都会得到每个元素，就好像只是引用数组中的一个元素一样。