我应该使用.find(".foo .bar")还是.children(".foo").children(".bar")？

Question

当使用jQuery for DOM遍历时,这两个返回相同的结果(我相信):

$("whatever").find(".foo .bar")
$("whatever").children(".foo").children(".bar")

哪个更好用？

Answer 1

它们不等同,我将在下面解释,但如果调整它们以匹配,.children()为了速度,.find()为了简洁(Sizzle中的额外工作,为初学者解析这个),你决定哪个更重要.

第一个有不同的结果,但如果你知道他们是孩子,你可以这样做:

$("whatever").find("> .foo > .bar")
//equal to...
$("whatever").children(".foo").children(".bar")

这相当于你的第二个功能.目前,第一个就像你拥有它会发现:

<whatever>
  <div class="foo">
    <span>
     <b class="bar">Found me!</b>
    </span>
  </div>
</whatever>

第二个不会,它要求.foo成为直接的孩子,whatever并且.bar要成为其中的直接孩子,.find(".foo .bar")允许他们处于任何层次的深度,只要.bar在其后代.foo.