当前位置：网站首页 >> 网页制作 >> Javascript/Ajax >> 文章内容

javascript程序的执行效率问题

2008-05-11 17:45:24 来源:蓝色理想 cityvoice

第三讲，尽量用cloneNode代替createNode
还是看例子

Webjx.Com

用cloneNode：

运行代码框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script type="text/javascript"> function init(){ var staDate = new Date(); var doc = window.document; for(var i=0;i<100;i++){ if(container.childNodes.length>0){ var oDiv = container.lastChild.cloneNode(true); oDiv.id="div_"+i; container.appendChild(oDiv); }else{ var oDiv = doc.createElement("div"); var oTab = doc.createElement("table"); var oTbody = doc.createElement("tbody"); var oTr = doc.createElement("tr"); var oTd = doc.createElement("td"); var oText = doc.createTextNode("毛主席向全世界宣布：中华人民共和国从此成立了"); container.appendChild(oDiv); oDiv.appendChild(oTab); oTab.appendChild(oTbody); oTbody.appendChild(oTr); oTr.appendChild(oTd); oTd.appendChild(oText); oDiv.id = "div_"+i; oDiv.style.width = "400px"; oDiv.style.height = "20px"; oDiv.style.backgroundColor = "#eee"; } } //alert(container.innerHTML); alert(new Date - staDate); } </script> </HEAD> <BODY> <div id="container"></div> <input type="button" value="start" onclick="init();" /> </BODY> </HTML>

网页教学网

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行] 网页教学网

用createNode：网页教学网

运行代码框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script type="text/javascript"> function init(){ var staDate = new Date(); var doc = window.document; for(var i=0;i<100;i++){ //if(container.childNodes.length>0){ //var oDiv = container.lastChild.cloneNode(true); //oDiv.id="div_"+i; //container.appendChild(oDiv); //}else{ var oDiv = doc.createElement("div"); var oTab = doc.createElement("table"); var oTbody = doc.createElement("tbody"); var oTr = doc.createElement("tr"); var oTd = doc.createElement("td"); var oText = doc.createTextNode("毛主席向全世界宣布：中华人民共和国从此成立了"); container.appendChild(oDiv); oDiv.appendChild(oTab); oTab.appendChild(oTbody); oTbody.appendChild(oTr); oTr.appendChild(oTd); oTd.appendChild(oText); oDiv.id = "div_"+i; oDiv.style.width = "400px"; oDiv.style.height = "20px"; oDiv.style.backgroundColor = "#eee"; //} } //alert(container.innerHTML); alert(new Date - staDate); } </script> </HEAD> <BODY> <div id="container"></div> <input type="button" value="start" onclick="init();" /> </BODY> </HTML>

网页教学网

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

点击这里返回本站的网页制作教程频道

Webjx.Com

共3页: 上一页 [1] [2] 3 下一页

复制链接发给好友网友评论收藏本文关闭此页

上一篇：js:商品分类后有一个方框指向到搜索栏

下一篇：网页用户注册界面的设计

文章评论

共有 0 位网友发表了评论查看完整内容

网页教学网

javascript程序的执行效率问题

相关文章

文章评论

阅读排行

专题教程

推荐文章

最新更新