伪选择器vs方法

Question

只是有兴趣，哪个更快？无法谷歌它。

例如，$('li:first') VS $('li').first()

Answer 1

更新：显然表达的解析招致大量的开销。 在我的quick benchmark.first()比使用选择器快很多。

表达式简单归结为$ .expr对象like explained here

实际执行上的方法：第一VS的。首先（）不同的一点：

这里的代码：上$.expr.setFilters.first第一

function (elem, i) { 
    return i === 0; 
} 

而$.fn.first简直是.eq(0)的缩写：

不看实际的代码

我实现第一（）这样的，如果它不存在：

$.extend($.expr[':'],{ 
    first: function(a) { 
     return $(a).first(); 
    } 
}); 

这也意味着：首先是一个简单的过滤元件的名单上，而.first（）是一个更有效的reduce操作。

Update2：Doh - 应该有read the docs。由于jQuery试图在现代浏览器中使用原生CSS选择器，并且:first没有CSS规范的选择器，它总是会比真正的选择器差得多，它可以利用浏览器原生CSS搜索方法（而jQuery必须模拟该行为在JS）

Answer 2

我不完全确定，但我的猜测是，它会在内部工作相同，所以表现不会有太大的差异。但我可能完全错误。

Answer 3

$('li').first()约比使用$('li:first')快十倍。 使用Firefox 3.6进行测试。使用

100,000 iterations: 
55,870ms using :first 
5,858ms using .first() 

验证码：

$(document).ready (function() { 
var i, time = +new Date; 
for (i = 0; i < 100000; ++i) { 
$('li:first'); 
} 
console.log ((+new Date) - time); 
time = +new Date; 
for (i = 0; i < 100000; ++i) { 
$ $('li').first(); 
} 
console.log ((+new Date) - time); 
});