WEB开发网
开发学院网页设计JavaScript Javascript动态生成表格的性能调优 阅读

Javascript动态生成表格的性能调优

 2010-09-14 13:09:03 来源:WEB开发网   
核心提示: vision 0.4 【耗时2779ms】一个document对象加载速度的优化就是在<script>标签指定defer属性,首先在这里简单介绍一下defer属性,Javascript动态生成表格的性能调优(4),defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的

vision 0.4 【耗时2779ms】

一个document对象加载速度的优化就是在<script>标签指定defer属性。首先在这里简单介绍一下defer属性。defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的问题,

加上defer等于在页面完全在入后再执行,相当于window.onload,但应用上比window.onload 更灵活。设置这个属性仅适合不需要立即运行<SCRIPT>中代码的情况。

(立即运行的代码指不在函数体内的--这些代码将会在脚本块加载后立即执行)当defer属性设置后,IE不会等待加载和转换这段脚本。这就也为着页面加载会快很多。

通常这意味着立即运行的脚本应该封装放在一个函数内,并通过document或者body的onload的事件处理。如果你的脚本是依赖于页面加载后的用户动作,如点击按钮,或者移动鼠标到某个区域,会更加有用!

最后请注意两点:

1、不要在defer型的脚本程序段中调用document.write命令,因为document.write将产生直接输出效果。

2、不要在defer型脚本程序段中包括任何立即执行脚本要使用的全局变量或者函数。

<html>
<body onload="init()">
<script defer>
function init() {
 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>

上一页  1 2 3 4 5 6 7  下一页

Tags:Javascript 动态 生成

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接