javascript动态生成table

本文介绍了一种使用JavaScript动态创建HTML Table的方法。通过getElementById获取指定div后,利用createElement创建table元素,并通过insertRow和insertCell添加行和单元格。文章还讨论了避免使用innerHTML和innerText的原因,推荐使用appendChild方法来添加新元素。

javascript动态生成Table是在迫不得以的情况下使用。因为表格会耗费大量的时间进行重绘。而且如果窗口变化了,还会引起意想不到的格式变化。所以最好不要使用。

先在<form>中添加一个<div id='divTable'></div>下面就可以使用javascript代码来做这个事情:

functioncreateTable(divName)

...{

vardiv=document.getElementById(divName);
vartable=document.createElement("table");//创建table
varrow=table.insertRow();//创建一行
varcell=table.insertCell();//创建一个单元
cell.width="10";//更改cell的各种属性
cell.style.backgroundColor="#999999";
}

你还可以发挥下想象力动态地创建各种各样的控件。上面的function是放置JS文件中的。

如果在html中的调用<script type="..." src="*.js"></script>

这里是创建了一个Table的元素,但是还没有加载到div层中去。

这里最好不使用div.innerHTML也不要使用div.innerText

要使用div.appendChild(table);

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值