Question

我只是注意到向选择器添加上下文比精炼选择器要快得多。

$('li',$('#bar')).append('bla');

快两倍：

$('#bar li').append('bla');

这一般是正确的吗？

Answer 1

向选择器添加上下文很多比精炼选择器更快

在一般情况下也是如此。但就你的具体例子而言，jQuery＆lt; = 1.2.6。

并不一定如此

直到并包括jQuery 1.2.6，选择器引擎以“自上而下”（或“从左到右”）的方式工作。这意味着你的例子都会这样（大致）：

var root = document.getElementById('bar');
return root.getElementsByTagName('li');

jQuery 1.3.x（即Sizzle，jQuery嵌入）introduced a "bottom up" (or "right to left") approach来查询DOM。所以$('#bar li')现在变成（大致）：

var results = [];
var elements = document.getElementsByTagName('li');
for(var i=0; i < elements.length; i++) {
    var element = elements[i];
    var parent = element.parentNode;
    while(parent) {
        if(parent.id == 'bar') {
            results.push(element)
            break;
        }
        parent = parent.parentNode;
    }
}
return results

这两种方法都有好处和缺点。你发现了一个缺点。

修改：刚刚从this discussion发现，Sizzle主干现在对#id首先选择者进行特殊豁免。它使用它作为根上下文，加快了一点。如果不能消除你所看到的速度差异，这应该会减少。

jQuery：向选择器添加上下文比精炼选择器快得多？

1 个答案: