哪些选择器可能更快？

Question

实际上有几个问题，

鉴于以下两个将返回相同的结果集

$("#MyTable tr");
$("tr", "#MyTable");

使用Parent-Child CSS选择器约定或指定选择器的上下文之间的性能是否存在差异？

另外，鉴于我可以保证tr将成为表的直接子项，这会改善上述表现吗？

$("#MyTable>tr")

Answer 1

$("#MyTable > tr")实际上可能无法正常工作，因为您应该将thead / tfoot或tbody作为表的直接子项。我认为ff / chrome等会为你添加tbody，因此选择器应该是

$("#MyTable > tbody > tr")

Answer 2

到目前为止，这三者中最快的是：

$("#MyTable > tr")

因为您正在通过id选择元素引用的直接后代，所以选择非常直接。

编辑：@redsquare指出上述内容在Firefox和Chrome中不起作用，因为这些浏览器会在表格中附加一个tbody元素。

上下文选择器基本上被转换为'finds'，因此前两个中最慢的是：

$("tr", "#MyTable");

因为在之前将其转换为之类的内容：

$('#MyTable').find('tr');

当然，你自己对它们进行基准测试可能会有很大的好处。

以前是关于SO的一些相关问题：

• jQuery selectors performance
• Good ways to improve jQuery selector performance?