jquery 動態增加table行，動態刪除table行

在html中我們大量的用到了局部刷新，局部刷新就是使用js來動態的修改html局部的數據。下面來介紹下使用jquery來動態的增加table的行，當然這種方式可以適用到任何的html組件中去。

1. <table id= "myTable" class="table">
2. <thead>
3. <tr>
4. <th>督導小組</th>
5. <th>組員</th>
6. <th>組長</th>
7. <th>操作</th>
8.  
9. </tr>
10. </thead>
11. <tbody id= "myTb">
12.  
13. </tbody>
14. < /table>

現在我們來動態的增加table的行，js代碼如下

1. var trTemp = $(" <tr id='tr"+groupId+"'></tr>");
2. trTemp.append(" <td>" + groupName + "</td>");
3. trTemp.append(" <td>"+ isNull(fullName) +"</td>");
4. trTemp.append(" <td>"+ isNull(groupLeader) +"</td>");
5. trTemp.append(" <td><button onclick='addGroupMember("+ groupId + ")'>添加組員</button><button onclick='addGroupLeader("+ groupId + ")'>添加組長</button><button style='background:red;' onclick='clearData("+groupId+")'>清除</button></td>");
6. trTemp.appendTo("#myTb");

原理就是把動態生成的html代碼添加到table中去

動態刪除就是獲取當前需要刪除的table元素，將其刪除，js代碼如下

$('#tr' + id).remove();

這樣就可以刪除掉了