jQuery选择器性能测试

2009 5 7 01:41 PM 2207次查看

分类：JavaScript 标签：JavaScript, jQuery, 性能

jQuery测试版本：1.3.1。

完成同一件事，即取id为d的元素内的p结点：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<div id="d"><p>1</p></div>
<script type="text/javascript">
var d0 = new Date();
for (var i = 10000; i >= 0; --i) {
	if (document.getElementById('d').getElementsByTagName('p').length != 1) {
		alert('Error 0');
		break;
	};
}
var d1 = new Date();
for (var i = 10000; i >= 0; --i) {
	if ($('#d p').length != 1) {
		alert('Error 1');
		break;
	};
}
var d2 = new Date();
for (var i = 10000; i >= 0; --i) {
	if ($('p', '#d').length != 1) {
		alert('Error 2');
		break;
	};
}
var d3 = new Date();
for (var i = 10000; i >= 0; --i) {
	if ($('#d').find('p').length != 1) {
		alert('Error 3');
		break;
	};
}
var d4 = new Date();
var d = document;
d.write(d1 - d0 + '<br\/>');
d.write(d2 - d1 + '<br\/>');
d.write(d3 - d2 + '<br\/>');
d.write(d4 - d3 + '<br\/>');
</script>
测试结果：

Chrome 0.4：
233
942
1354
1384
# 3和4有波动，有时是4快于3
IE 6：
438
11718
14125
16125
# 3和4有波动，有时是4快于3
Firefox 3.0.3：
325
4645
2420
2312
Safari 3.1.2：
94
922
1609
1563
Opera 9.62：
172
3453
2016
1859
让我很意外的是，Firefox和Opera的第2个方法居然慢这么多，而其他浏览器则相反。
当然，最快的还是DOM的方法，基本都快了1个数量级。
不过如果都可以的话，我应该会用第2种写法，毕竟最方便…

2条评论 你不来一发么↓ 顺序排列 倒序排列

    向下滚动可载入更多评论，或者点这里禁止自动加载。

    想说点什么呢？