哪个更有效 - $('selector').last() 或 $('selector:last')？答案

【问题标题】：Which is more efficient - $('selector').last() or $('selector:last')?哪个更有效 - $('selector').last() 或 $('selector:last')？
【发布时间】：2012-08-25 22:01:33
【问题描述】：

我有一个包含很多子元素（1000 个）的父元素。我正在寻找最快的方法来处理最后一个子元素。我发现的选项是：

$('.parent .child').last()

和

$('.parent .child:last')

对于哪一个在浏览器中更快可靠有什么意见？

编辑

我在 jsfiddle 中编写了一个测试来衡量这一点，结果发现差异几乎可以忽略不计。尽管 .last() 表现更好，但差异可以忽略不计。所以我认为即使使用 :last 选择器，它实际上是获取整个元素列表然后返回最后一个元素？难以置信。

小提琴： http://jsfiddle.net/techfoobar/GFb9f/8/

【问题讨论】：

考虑针对此类问题的 jsperf 测试用例 ..
重复：stackoverflow.com/questions/4262928/…
当然最快的方法是使用element.lastChild。除非您正在寻找后代而不是孩子。也可以考虑var els = document.querySelectorAll('.parent .child'); $(els[els.length - 1])。
请注意，:last documentation 表示“要在使用 :last 选择元素时获得最佳性能，请先使用纯 CSS 选择器选择元素，然后使用 .filter(":last")。”
参考 RobG 上面的评论，$(els).get(-1); 比$(els[els.length - 1]) 更简洁，虽然我不能评论相对效率。

标签： javascript jquery

【解决方案1】：

你必须看到这个performance test！

更新：这个related question已经有了很好的答案。

【讨论】：

感谢@RobinMaben - 提供链接。信息量很大。我想我会选择 .last() 因为它符合我对可读性和性能的品味..
@techfoobar：我刚刚浏览了你的博客。整洁的东西。完全同意code that can’t be read shouldn’t have been written。 :)
@RobinMaben - 谢谢。 :) 博客已经沉睡了一段时间了！需要放一些东西在那里..

【解决方案2】：

许多现代浏览器都支持document.querySelectorAll()，所以$('.parent .child').last() 应该更快，因为选择器字符串可以按原样传递，然后弹出最后一个匹配项。

在后者中，:last 不是标准的伪选择器，Sizzle 必须开始对选择器字符串进行分块才能开始匹配。

不过，总的来说，我会使用您认为最易读的内容。要开始对此进行优化，首先要确保您的应用程序存在性能问题，并且您已将此选择器确定为瓶颈。

【讨论】：

sizzle 如何决定是否可以按原样传递选择器？
@zerkms 从内存中，将调用包装在 try/catch 中，并在 catch 块中解析其字符串。不过我最近没有检查来源。
@RobG：所以你建议回复 RTFS 的任何评论？
我做了一个小提琴来测试这一点（直到现在还没有使用过 jsperf） - 似乎 .last() 成为赢家，即使只是勉强。
谢谢大家。我想我会选择 .last() 因为它符合我对可读性和性能的品味..