?

动态添加表格行 ?

文/Ray

?表格部分代码如下：

<table id=" testTbl " border=1>

<tr id=" tr1 ">

<td width=6%><input type=checkbox id=" box1 "></td>

<td id="b">第一行</td>

</tr>

<tr id=" tr2 ">

<td width=6%><input type=checkbox id=" box2 "></td>

<td id="b">第二行</td>

</tr>

<tr bgcolor=#0000FF>

<td width=6%><input type=checkbox id=" box3 "></td>

<td> 第三行</td>

</tr>

</table>

动态添加表行的 javascript 函数如下：

function addRow(){

// 添加一行

var newTr = testTbl .insertRow();

// 添加两列

var newTd0 = newTr.insertCell();

var newTd 1 = newTr.insertCell();

// 设置列内容和属性

newTd0.innerHTML = ' <input type=checkbox id=" box4 "> ';

newTd2.innerText= ' 新加行 ';

}

就这么简单，做点详细 的说明：

1 、 inserRow() 和 insertCell() 函数

insertRow() 函数可以带参数，形式如下：

insertRow(index)

这个函数将新行添加到 index 的那一行前，比如