js用克隆(clone)的方法动态添加表格行
|
admin
2010年12月31日 10:28
本文热度 3187
|
在js中用克隆(clone)的方法动态添加表格(table)行(tr):
用javascript的克隆方法添加表格的行要比用innerHTML方法代码简洁的多,主要使用Obj.cloneNode(true);方法进行克隆.
看下面的代码:
<select onchange="add_row(parseInt(this.options[this.selectedIndex].text,10),document.getElementById(’cloneTR’))">
<option selected>0000</option>
<option>1111</option>
<option>2222</option>
<option>3333</option>
<option>4444</option>
<option>5555</option>
</select>
<table id="hiddentbl">
<tr id="cloneTR" style="display:none">
<td>11111</td>
<td>22222</td>
<td>33333</td>
<td>44444</td>
</tr>
</table>
<script type="text/javascript">
function add_row(rowNum,Obj){
for(var i=1;i<Obj.parentNode.rows.length;i++){
Obj.parentNode.removeChild(Obj.parentNode.rows[i]);
i--;
}
for(var i=0;i<rowNum;i++){
var con = Obj.cloneNode(true);
con.removeAttribute("style")
Obj.parentNode.insertAdjacentElement("beforeEnd",con);
}
}
</script>
该文章在 2010/12/31 10:28:28 编辑过