javascript add table 很慢

fgc5201314 2008-04-01 11:10:06

用javascript add table row的时候,用insertRow的方法,如果加载3000多个input时,特慢,需要1分钟左右,有没有方法搞快一点?

...全文

804 33 打赏收藏转发到动态举报

写回复

用AI写文章

33 条回复

切换为时间正序

请发表友善的回复…

发表回复

chenhongxin 2008-05-07

打赏
举报

<div id="div1"> </div>
<script language=javascript>
var strHTML=new Array();
strHTML[0]="<table border='1'>"
for(var i=0;i<3000;i++)
{
strHTML[strHTML.length]="<tr><td>label</td><td><input name='aaa'></td></tr>"
}
strHTML[strHTML.length]="</table>"
document.getElementById("div1").innerHTML=strHTML.join("")
</script>

fgc5201314 2008-05-06

打赏
举报

en..各种效果都不是很理想..

最佳的还是在服务器里组装好html.. 之后 div.innnerHTML= html....

hai_literature 2008-04-14

打赏
举报

可以把那些控件分成多批，利用线程的特点来做，效率应该会提高，试试吧，说不定会有新的发现

zhangqingfu 2008-04-14

打赏
举报

1、在Table的外面加个DiV
2、取数据库的代码的时候，组装好Table的HTML
3、使用Div的innertHTML

oldjwu 2008-04-14

打赏
举报

先创建DOM文档碎片，
var documentFragment = document.createDocumentFragment();
然后3000个input添加到documentFragment里，最后再把这个documentFragment添加到DOM树中。

邻里亲戚 2008-04-13

打赏
举报

同意楼上的意见

街头小贩 2008-04-13

打赏
举报

[Quote=引用 9 楼 mingxuan3000 的回复:]
3000多个input 本来就很慢的
[/Quote]
不能像微软的office站点一样吗？
初始有20个！添完再显示下20个,在没添完1－20之前看不到:21-40的input

bruceleeliya 2008-04-13

打赏
举报

同意楼上的意见

christ888 2008-04-12

打赏
举报

可以用 document.getElementsByTagName碎片一次添加，效率会很高！

miracleliu 2008-04-11

打赏
举报

楼上是卖书的。。鉴定完毕！

LZ说的完全不明白。。。

jxpath 2008-04-09

打赏
举报

建议参考电子工业出版社的书《JavaScript高级应用与实践》（夏天编著）中的“非阻塞多线程模型”在表格中的应用章节

laowan688 2008-04-07

打赏
举报

沃尔特容易 2008-04-07

打赏
举报

div 比 table 要快很多。

gghunter 2008-04-07

打赏
举报

[Quote=引用 16 楼 kxscr 的回复:]
引用 4 楼 fgc5201314 的回复:
因为数据是批量修改的,而且3000多个都是动态的,有时候可能只是2500嘛,有时就很多.所以只是有insertRow的方法.

table是不可以用innerHTML的..

我试过 document.getElementById("table").innerHTML=" <tr> <td>aaa </td> </tr>" 这样会出错的..

table的实体是thead tbody tfoot 你这样写当然会出错
[/Quote]

你试过?可以正常运行?

kxscr 2008-04-07

打赏
举报

[Quote=引用 4 楼 fgc5201314 的回复:]
因为数据是批量修改的,而且3000多个都是动态的,有时候可能只是2500嘛,有时就很多.所以只是有insertRow的方法.

table是不可以用innerHTML的..

我试过 document.getElementById("table").innerHTML=" <tr> <td>aaa </td> </tr>" 这样会出错的..
[/Quote]

table的实体是thead tbody tfoot 你这样写当然会出错

囧 2008-04-07

打赏
举报

可以用字符串创建整个Table, 在IE下用数组比用+号快很多. FF好像没这个问题.
var html = [];
html.push("<table ....>");
for(var i=0; i<3000; i++){
html.push("");
}
container.innerHTML = html.join("");

myevi 2008-04-07

打赏
举报

1.如果可以在后台组织的话后台组织应该会快很多，但是造成耦合会大些，维护麻烦
2.如果必须在页面上完成这些，能不能尝试，预先定于3000（中值）个html元素，大于3000的在动态加载，小于3000的情况delete或是hidden，减少循环次数
，div速度确实会快点，可以考虑在div中做这些操作

cloudgamer 2008-04-03

打赏
举报

因为ie默认有tbody的关系

hbhbhbhbhb1021 2008-04-03

打赏
举报

IE下拼数组



<div id="div1"> </div>

<script language=javascript>

		var strHTML=new Array();

		strHTML[0]="<table border='1'>"

		for(var i=0;i<3000;i++)

		{

			strHTML[strHTML.length]="<tr><td>label</td><td><input name='aaa'></td></tr>"

		}

		strHTML[strHTML.length]="</table>"

		document.getElementById("div1").innerHTML=strHTML.join("")

</script>