JS删除table的行和列

时间:2019-02-11
本文章向大家介绍JS删除table的行和列,主要包括JS删除table的行和列使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
<script >
		function deleteCol(obj){
		    var index=obj.cellIndex;
		    var table = document.getElementById("table");
		    var len = table.rows.length; 
		    for(var i = 0;i < len;i++){
		        table.rows[i].deleteCell(index);
		    }
		}
		function deleteRow(obj){
		    var index=obj.parentNode.rowIndex;
		    var table = document.getElementById("table");
		    table.deleteRow(index);
		}
		</script>
		<style>
		table *{border:1px red solid;}
		</style>

<table id="table">
       <tr class="onclickHead">
           <td onclick="deleteCol(this)">删除列</td>
           <td onclick="deleteCol(this)">删除列</td>
           <td onclick="deleteCol(this)">删除列</td>
           <td onclick="deleteRow(this)">删除行</td>
           <td> </td>
       </tr>
       <tr>
          <td>名字</td>
          <td>年龄</td>
          <td>性别</td>
          <td onclick="deleteRow(this)">删除行</td>
       </tr>
       <tr>
          <td>张三</td>
          <td>36</td>
          <td>男</td>
          <td onclick="deleteRow(this)">删除行</td>
       </tr>
</table>