javascript - 更好的 JQuery 性能语法？

Question

下面的 2 语法是否有任何性能差异含义？

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

有人告诉我第一个只会搜索span谁的类，foo而第二个会在所有元素中搜索。

Answer 1

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

根据标记，它们都可能具有不同的结果。

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

看看这个jsperf 基准测试

Answer 2

谁告诉过你这是对的。

在选择两个超过100,000个迭代的元素时，看起来大约是半秒（Firefox，铬的小于此）。

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”类的跨度，您可能会选择不需要的元素