我应该使用.find(“.foo.bar”)还是.children(“.foo”).children(“.bar”)?

它们不是等价的,我将在下面解释,但是如果调整它们以匹配, .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") 允许他们在任何水平深度,只要 酒吧 在…的后代中 福 .

可选地:

$('whatever .foo .bar')

(或) >.foo>.bar 如果你只想要直接的孩子。)

只要 whatever 是一个标准的CSS3选择器(不使用任何特定于sizzle的扩展),像上面这样的单个文档相关选择器将被传递给 document.querySelectorAll 在现代浏览器上,这将比Sizzle的手动树行走快得多。

[虽然理论上可以使用 element.querySelectorAll 对窗体进行查询 $(...).find(...) 快速,jquery目前不会使用这种方法,因为在如何解决选择器API标准和jquery的传统作用域行为之间的相对选择器方面存在不同意见。]