jQuery选择器性能

假设您至少使用了jQuery 1.3(即添加了Sizzle),您看到的性能是由于遍历DOM的方式发生了变化。自 here :

包括jQuery 1.2.6在内 Sizzle ,jQuery嵌入)引入了“自下而上”(或 “从右向左”)查询方法 DOM。

"td.someColumnClass span.editMode input" ),Sizzle有效地做到了这一点:

1. 获取全部 input 内部元素 someTableRow
2. 输入 找到元素,遍历其祖先树 span 元素与 class="editMode" .删除 输入
3. 对于每一个 span.editMode 找到元素,遍历其祖先树 td 元素与 class="someColumnClass" .删除 输入

然而,在您的第一个示例中,您每次调用都会明确地限定每个步骤 find() ,定义上下文并遍历 下 从那里。你正在执行“自上而下”的方法。这相当于在每个步骤中传递一个上下文,即 generally considered a performance booster :

$('input', $('span.editMode', $('td.someColumnClass', someTableRow)))

正如乔希所指出的那样,将上下文简化为搜索是关键。

var columnClasses = $('.someColumnClass');
var tableCell = $('td', columnclasses);
var editMode = $('.editmode', tableCell);
var spanInside = $('span', editMode);
var inputFinally = $('input', spanInside);

丹

jQuery Selector Performance

这里有一篇关于选择器性能的非常有趣的文章: http://blogs.atlassian.com/developer/2009/08/jquery_bondage.html