jQuery中最快的子()或find()是什么？

Question

jQuery中最快的子()或find()是什么？要在jQuery中选择子节点，可以使用子节点()，也可以使用find()。例如：$(this).children('.foo');得出的结果与：$(this).find('.foo');现在，哪个选项是最快的还是首选的？为什么？

Answer 1

children()只查看节点的直接子节点，而find()遍历节点下面的整个DOM，因此children()应给定相应的实现，速度更快。然而，find()使用土生土长浏览器方法，同时children()使用JavaScript在浏览器中解释。在我的实验中，在典型的情况下，性能没有太大的差别。

使用哪种方法取决于您是否只想考虑DOM中的直接后代或该节点下面的所有节点，也就是说，根据您想要的结果选择适当的方法，而不是方法的速度。如果性能确实是一个问题，那么就尝试找到最好的解决方案并使用它(或者在这里的其他答案中看到一些基准)。

Answer 2

这，这个jsPerf试验表明find()更快。我创建了一个更彻底的测试，而且看起来find()仍然比子()更好。

最新情况：根据tvanfosson的评论，我创建了另一个测试用例有16个层次的筑巢。find()只在找到所有可能的div时比较慢，但find()在选择第一级div时仍然优于子级。

当嵌套级别超过100个时，子级()开始优于find()，并且大约有4000+div来遍历find()。这是一个基本的测试用例，但在大多数情况下，我仍然认为find()比child()更快。

我在ChromeDeveloper工具中浏览了jQuery代码，注意到子()在内部调用兄弟()、filter()，并经历了比find()更多的regexe。

find()和child()满足不同的需求，但是在find()和子()输出相同结果的情况下，我建议使用find()。

Answer 3

这并不一定会产生同样的结果：find()会给你带来什么后人节点，而children()只会让你直系亲属那个火柴。

有一次，find()速度要慢得多，因为它必须搜索可能匹配的每个子节点，而不仅仅是直接的子节点。然而，这已不再是事实；find()由于使用本机浏览器方法，速度要快得多。