我有一个场景,我知道我要寻找的div正好是两个级别。
使用效率更高:
$('#mydiv').find('.myselector')
或
$('#mydiv').children().children('.myselector')
使用您的控制台检查。首先检查您的第一个建议:
console.time('benchmark');
for (var i=0; i<1000; i++) {
var $elem = $('#mydiv').find('.myselector');
}
console.timeEnd('benchmark');
现在为您的第二个建议做同样的事情:
console.time('benchmark');
for (var i=0; i<1000; i++) {
var $elem = $('#mydiv').children().children('.myselector');
}
console.timeEnd('benchmark');
运行两个版本几次,以真正检查是否存在显着差异。使用这种测试方式来优化选择器。
尝试一下:
var elems = document.getElementById('mydiv').querySelectorAll(".myselector");
jQuery与我的一些香草JS想法的比较。
编辑:对于IE7支持:
var container = document.getElementById('mydiv'), elems = [],
firstlevel = container.children, l = firstlevel.length,
secondlevel, m, i, j;
for( i=0; i<l; i++) {
secondlevel = firstlevel[i].children;
m = secondlevel.length;
for( j=0; j<m; j++) {
if( secondlevel[j].className.match(/bmyselectorb/)) {
elems.push(secondlevel[j]);
}
}
}
...是的,不漂亮!但仍然比jQuery快!