<table>
<tr id="item">
<td>cftea</td>
<td>千一</td>
</tr>
</table>
<tr id="item">
<td>cftea</td>
<td>千一</td>
</tr>
</table>
如上代码,如何把 item 复制很多份呢,让表格有很多行?
for (var i = 0; i < 15; i++)
{
var node = document.getElementById("item").cloneNode(true);
node.id = "item_" + (i + 1);
document.getElementById("item").parentNode.appendChild(node);
}
{
var node = document.getElementById("item").cloneNode(true);
node.id = "item_" + (i + 1);
document.getElementById("item").parentNode.appendChild(node);
}
代码很简单,但是有些说明很重要:
- cloneNode 的参数为 true,表示复制子节点;如果为 false 的话,就只复制 tr,tr 下面的 td 不会被复制。
- 不要用 innerHTML 代替 cloneNode。
- 不能把 cloneNode 这句提到循环外面。
- 要给复制的 node 赋唯一的 id。