再看看这个<form id=form1 name=form1><input id=txt name=txt></form><button onclick=test()>测试</button>
<div id=div1></div>
<script>
var count=1000;
var i=0;
var obj=null;function test(){
slow();
fast();
}function slow(){
var d=new Date();
for(i=0;i<count;i++){
document.form1.txt.style.display=(i%2)?"block":"none"
}
div1.innerHTML=div1.innerHTML+String(new Date()-d)+" "
}
function fast(){
var d=new Date();
var css=document.form1.txt.style.display
for(i=0;i<count;i++){
css=(i%2)?"block":"none"
}
div1.innerHTML=div1.innerHTML+String(new Date()-d)+"<br>"
}
</script>
<div id=div1></div>
<script>
var count=1000;
var i=0;
var obj=null;function test(){
slow();
fast();
}function slow(){
var d=new Date();
for(i=0;i<count;i++){
document.form1.txt.style.display=(i%2)?"block":"none"
}
div1.innerHTML=div1.innerHTML+String(new Date()-d)+" "
}
function fast(){
var d=new Date();
var css=document.form1.txt.style.display
for(i=0;i<count;i++){
css=(i%2)?"block":"none"
}
div1.innerHTML=div1.innerHTML+String(new Date()-d)+"<br>"
}
</script>
解决方案 »
- extjs验证用户名已存在问题,一个很诡异的问题,就算不会也希望能顶一下帖子无限感谢
- 请问这两个对象为什么不相等啊
- 简单字符串匹配问题,帮忙者都给分。
- 关于window.showModelessDialog一个比较麻烦的的问题,你能解决?
- QComboBox 下拉框背景色怎么弄
- --------------高分求js日期控件!!!-----------------
- 有没有这种做法?
- 如何让页面下载过程中出一幅图片或“请等待”的字样???????
- 帮我看一下这个javascript
- 为什么运行时总说document.formname.hiddenName.length为未定义的?
- <iframe>的问题
- 如何打开一个不可见的窗口
function table1(){
var d=new Date();
var tr=null;
var td=null;
for(i=0;i<count;i++){
tr=tbl1.insertRow()
td=tr.insertCell()
//tr.appendChild(td)
td.innerHTML="gorush"
}
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 "
}
你多做了一步完全不必要的 tr.appendChild(td),速度慢了大约5、6倍。去掉后1和2的速度没有很大差异。
<script>
var count=1000;
var i=0;
function create(){
table1()
table2()
table3()
table4()
}function table1(){
var d=new Date();
var tr=null;
var td=null;
for(i=0;i<count;i++){
tr=tbl1.insertRow()
td=tr.insertCell()
td.innerHTML="gorush"
}
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 "
}function table2(){
var d=new Date();
var tr=null;
var td=null;
var tbody=tbl2.firstChild;
for(i=0;i<count;i++){
tr=document.createElement("TR")
td=document.createElement("TD")
tbody.appendChild(tr)
tr.appendChild(td)
td.innerHTML="gorush"
}
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 "
}function table3(){
var d=new Date();
var tr=null;
var tbody=tbl3.firstChild;
var oldtr=tbody.firstChild;
for(i=0;i<count;i++){
tr=oldtr.cloneNode(true)
tbody.appendChild(tr)
}
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 "
}
function table4(){
var d=new Date();
var ar = [];
var st="<tr><td>gorush</td></tr>"
for(i=0;i<count;i++){
ar[i] = st
}
tbl4.parentNode.innerHTML=tbl4.outerHTML.replace(/<\/table>/i,"")+ar.join("")+"</table>";
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 <br>"
}</script><button onclick=create()>create table</button>
<div id=div2 style="font-size:12px"> </div><table id=tbl1 border style="display:inline">
<tbody>
<tr><td>gorush</td></tr>
</tbody>
</table><table id=tbl2 border style="display:inline">
<tbody>
<tr><td>gorush</td></tr>
</tbody>
</table><table id=tbl3 border style="display:inline">
<tbody>
<tr><td>gorush</td></tr>
</tbody>
</table>
<span>
<table id=tbl4 border style="display:inline">
<tbody>
<tr><td>gorush</td></tr>
</tbody>
</table>
</span>
</BODY>
var d=new Date();
var ar = [tbl5.outerHTML.replace(/<\/table>/i,"")];
var st="<tr><td>gorush</td></tr>"
for(i=1;i<count-1;i++){
ar[i] = ""
}
ar[count]="</table>"
tbl5.parentNode.innerHTML=ar.join(st);
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"秒 "
}
方法我如果碰到嵌套TABLE是就會出錯﹐所以我認為應該修正一下
var ar = [tbl5.outerHTML.replace(/<\/table>$/i,"")];
/<\s*\/table\s*>$/i
function table5(){
var d=new Date();
var ar = new Array(count+1);
var st="<tr><td>gorush</td></tr>"
tbl5.parentNode.innerHTML=tbl5.outerHTML.replace(/<\/table>/i,"")+ar.join(st)+"</table>";
div2.innerHTML=div2.innerHTML+String(new Date()-d)+"Ãë <br>"
}对换测试顺序后发现,排在前面的测试比较占便宜。
这样可读性就。我的代码的那几种方法都还算常规的啦
<input id=t>
<SCRIPT LANGUAGE="JavaScript">
<!--
alert(t.style.display.constructor)
//-->
</SCRIPT>
</BODY>所以var css=document.form1.txt.style.display只是复制了display串得到一个新的串。然后你不停的改新的串的内容,对style对象一点影响都没有。
var css=document.form1.txt.style
for(i=0;i<count;i++){
css.display=(i%2)?"block":"none"
}
发贴的时候觉得可以写得更进一步,结果写错了(我居然没有细加测试,晕)这个代码只是说明一个问题。把对象缓存为局部变量,操作起来会快很多