Javascript动态生成表格的性能调优
2010-09-14 13:09:03 来源：WEB开发网对这些全局变量引用要比简单通过局部变量引用的代价要昂贵的多。
这里我们可以将"document.body"的引用缓存到局部变量中，这样就完成了一个将全局对象转换成局部变量的过程。
在代码中添加：var docBody = document.body;并且将行：document.body.insertBefore(_table, null);替换为：docBody.insertBefore(_table, null);
在代码中对"document"单个全局对象的引用就达到8×3000=24000次之多，获取一个document变量比局部变量大约多花费4ms时间, 所以我们下一步把document对象也缓存起来。
在代码中添加：var _doc = document;
这样，我们重新加载页面，所耗时间为3320毫秒。只比上个版本所耗的时间减少了10％，似乎性能相差不大，但是在我们日常的开发习惯中，将全局的对象缓存到局部变量中是一个好的开始。
<html>
<body>
<script>
var _table, _tbody, tr, td, text, maxRow, maxCol;
var docBody = document.body;
var _doc = document;
maxRow = 3000;
maxCol = 8;
_table = _doc.createElement("table");
_table.border = "1";
_tbody = _doc.createElement("tbody");
_table.insertBefore(_tbody, null);
docBody.insertBefore(_table, null);
for (var i=0; i<maxRow; i++) {
tr = _doc.createElement("tr");
for(var j = 0; j<maxCol; j++){
td = _doc.createElement("td");
text = _doc.createTextNode("Text");
td.insertBefore(text, null);
tr.insertBefore(td, null);
}
_tbody.insertBefore(tr, null);
}
</script>
</body>
</html>
Tags：Javascript 动态 生成
编辑录入：爽爽 [复制链接] [打 印]
中查找“Javascript动态生成表格的性能调优”更多相关内容
中查找“Javascript动态生成表格的性能调优”更多相关内容更多精彩
赞助商链接
