更好的JQuery性能语法

Question

下面两种语法是否有性能差异的含义?

1. $(“span.foo”)
2. $(“.foo”)

有人告诉我，第一个只搜索span，其类是foo，而第二个将搜索所有元素

Answer 1

如果您正在寻找与性能相关的问题，那么最好对不同的解决方案进行基准测试，看看哪个解决方案更好。

基于标记，它们都可能有不同的结果。

但是如果你只有span的类foo，那么第二个将更快。
_{原因可能是在第一种情况下，它将首先加载文档中的所有span's，然后用foo类对它们进行过滤，而第二种情况将使用本地getElementsByClassname来获取元素。}

看一下这个jsperf基准测试

Answer 2

谁告诉你那是对的。

当选择两个元素超过100,000次迭代时，看起来大约需要半秒(Firefox, Chrome更短)。

http://jsfiddle.net/83qcy/

var start, end, i;
start = new Date();
for(i = 0; i < 100000; i++){
    $("span.foo");
}
end = new Date();
$("span.foo").html(end - start);
start = new Date();
for(i = 0; i < 100000; i++){
    $(".foo");
}
end = new Date();
$("div.foo").html(end - start);

我相信你可以想象，选择更多的元素肯定会花费更长的时间。您可能也不会选择100,000次，但是随着网站变得更大，javascript性能可能是最大的因素之一，jQuery的上下文和选择器可以使其更高效。

此外，如果您只想将函数应用于类为"foo"的span