表格的行删除新增

HTML部分：

1. <table width="100%" class="gridtable" id="myTable">
   
2.   <tr>
   
3.     <th scope="col">规格</th>
   
4.     <th scope="col">价格</th>
   
5.     <th scope="col">积分</th>
   
6.     <th scope="col">分佣</th>
   
7.     <th scope="col">管理</th>
   
8.   </tr>
   
9.   <tr>
   
10.     <td> <input name="title" type="text" id="title" value="" class="form-control" required></td>
    
11.     <td><input type="text"  name="url" id="url"  class="form-control" ></td>
    
12.     <td><input type="text"  name="url" id="url"  class="form-control" ></td>
    
13.     <td><input type="text"  name="url" id="url"  class="form-control" ></td>
    
14.     <td><a href="javascript:addRow();">新增 </a>&nbsp;<a href="javascript:" onClick="delRow(this);">删除</a></td>
    
15.   </tr>
    
16.    
    
17. </table>

复制代码

1. function addRow() {
   
2.   // (B1) GET TABLE
   
3.   var table = document.getElementById("myTable");
   
4.   var row = table.insertRow();
   
5.   var html=table.rows[1].innerHTML;
   
6.   console.log(html);
   
7.    row.innerHTML = html;
   
8. }
   
9. 
   
10. function delRow(r)
    
11. {
    
12. var i=r.parentNode.parentNode.rowIndex;
    
13. console.log(i)
    
14. var table = document.getElementById("myTable");
    
15. table.deleteRow(i);
    
16. }

复制代码