Question

我什么时候会使用jQuery的.find()？

例如，

$('tr').find('.someClass');相当于$('tr .someClass')

那么，什么时候使用.find()作为直选的时候会是一个很好的例子呢？

另外，哪个性能更高？选择器是否比.find()更快？

Answer 1

答案是尽可能。

它总是比拥有子项/多项/ CSS /上下文选择器更高效，并且是性能最快的遍历机制。

jsPerf to show what I mean

您唯一可以考虑不使用它的方法是，如果您只想选择直接孩子的项目，并且这些孩子碰巧与您不想选择的孩子一样。这是.children()的工作，但这种情况非常罕见。

Answer 2

这取决于你选择的是什么。

随着$('tr')选择的元素数量增加，.find将变得更加昂贵。

一般来说，最好做任何会导致触及最少数量元素的事情。当你只处理2个元素（父母和孩子）时，.find显然会更快，因为它只是一个父母得到它的孩子并过滤到选择器。但是当有200个父母时，它将不得不迭代所有200个并在每个中搜索孩子。通过使用选择器开始，您永远不会触及所有父母，您只需直接转到子元素。即便如此，一个与另一个的性能会因浏览器而异。

花费更少的时间来担心这些微观优化，直到它成为你试图解决的真正问题，并且在那时，解决这个问题，而不是试图找出一个遵循的一般规则。

Answer 3

.find()仅用于搜索表示DOM元素的jQuery对象的后代。

示例用例是将表示表单元素的jQuery对象传递给表单解析函数，然后使用.find()从表单的子输入中获取不同的值。

不是每次想要获取元素时都将表单转换为jQuery对象，而是将jQuery表单对象分配给变量更便宜，然后使用.find()来获取输入。

在代码中，这个：

var $form = $('#myFormId'),
    firstName = $form.find('input[name="firstName"]').val(),
    lastName = $form.find('input[name="lastName"]').val();

比这更便宜：

var firstName = $('#myFormId input[name="firstName"]').val(),
    lastName = $('#myFormId input[name="lastName"]').val();

使用.children()比使用{{1}}更便宜，请参阅this reference，除非您正在搜索正在操作的jQuery对象的直接子项。

希望这是有道理的：）

Answer 4

上面的很好的答案，但只是想添加.find（）是一个基于后代的搜索。因此，它会找到所有Dom元素的子元素。

何时使用jQuery的.find（）

4 个答案: