用Javascript实现添加删除表格行

 function addRow(obj)
02 {
03     var clickedRow = obj;
04
05     while(clickedRow.tagName != "TR")
06     {
07         clickedRow = clickedRow.parentNode;
08     }
09
10     var clickedTable = clickedRow.parentNode;
11
12     var newRow = clickedTable.insertRow(clickedRow.rowIndex + 1);
13
14     newRow.className = clickedRow.className;
15
16     for(var i = 0; i < clickedRow.childNodes.length; i++)
17     {
18         if (clickedRow.childNodes[i].tagName != "TD")
19         {
20             continue;
21         }
22
23         var newCell = clickedRow.childNodes[i].cloneNode(true);
24
25         for(var j = 0; j < newCell.childNodes.length; j++)
26         {
27             if (newCell.childNodes[j].value)
28             {
29                 newCell.childNodes[j].value = "";
30             }
31         }
32
33         newRow.appendChild(newCell);
34     }
35 }
36
37 function removeRow(obj)
38 {
39     var clickedRow = obj;
40
41     while(clickedRow.tagName != "TR")
42     {
43         clickedRow = clickedRow.parentNode;
44     }
45
46     clickedRow.parentNode.removeChild(clickedRow);
47 }

调用方式:摘要在单元格里找一个载体,加上事件就可以了:如:οnclick="addRow(this)" / οnclick="removeRow(this)"

代码兼容IE/Firefox。

==========================================

补充一个如何删除表格中的列:

1 function removeCol(col_index){
2     for (var i = 0; i < document.getElementById("table").rows.length; i++) {
3         document.getElementById("table").rows[i].deleteCell(col_index);
4     }
5 }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值