jQuery 选择器性能： $('#a p') 与 $('p'， $context) 与 $context.find('p')

Question

如果我已经在变量$a_div中获得了下面标记中div的jQuery对象，并且我想找到Ps

<div id="a">
    ...
    <p>...</p>
    ...
</div>

在DIV中选择p元素的这些方法之间是否存在显著的性能差异？

$('#a p')
$('p', $a_div)
$a_div.find('p')

如果是这样，你知道为什么吗？

Answer 1

这类东西通常依赖于浏览器，但我会使用第三种。

首先，带有querySelectorAll的浏览器会使用它，所以性能应该很好。

在不支持qsa的浏览器中，我认为Sizzle会在页面上找到所有p元素，并遍历它们的祖先以查看是否有#a元素。

$('#a p')

---

我根本不会使用第二个，因为它在后台被更改为第三个。

$('p', $a_div)   // becomes $a_div.find('p')

---

无论是通过querySelectorAll还是getElementsByTagName，您都是从DOM中的一个已知点开始，并且只在其中进行搜索，所以我敢打赌这通常是最快的。

$a_div.find('p')

Answer 2

您可以随时测试它-http://jsperf.com/some-jquery-selectors-performance-tests

第二个似乎是第一个的三倍，第三个稍微多一点。根据HTML结构的其他部分，这肯定会有所不同，但我敢肯定第一个总是最慢的。