javascript DOM操作之动态删除TABLE多行

更新时间：2009年12月18日 00:48:21 作者：

DOM动态删除TABLE tr行的实现代码，需要的朋友可以参考下。

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>DOM动态删除TABLE多行</title> <script type="text/javascript"> function $(objId){ return document.getElementById(objId); } function del_tbl(tblN,ckN){ var ck = document.getElementsByName(ckN);     var tab = $(tblN); var rowIndex; for(var i=0;i<ck.length;i++){         if(ck[i].checked){ rowIndex = ck[i].parentNode.parentNode.sectionRowIndex;          tab.deleteRow(rowIndex); i = -1; } } }</script> </head> <body> <form id="form1" name="form1" method="post" action=""> <table width="253" border="1" align="center" id="list"> <tr> <td><input type="checkbox" name="cb_k" id="cb_k" /></td> <td>2</td> <td>3</td> </tr> <tr id="tr1"> <td width="28" height="41"><input type="checkbox" name="del" id="del" /></td> <td width="124"><div align="center">第一行 </div></td> <td width="79"><div align="center">1</div></td> </tr> <tr id="tr2"> <td height="36"><input type="checkbox" name="del" id="del" /></td> <td><div align="center">第二行 </div></td> <td><div align="center">2</div></td> </tr> <tr id="tr3"> <td height="40"><input type="checkbox" name="del" id="del" /></td> <td><div align="center">第三行 </div></td> <td><div align="center">3</div></td> </tr> <tr id="tr4"> <td height="37"><input type="checkbox" name="del" id="del" /></td> <td><div align="center">第四行 </div></td> <td><div align="center">4</div></td> </tr> <tr id="tr5"> <td height="50"><input type="checkbox" name="del" id="del" /></td> <td><div align="center">第五行 </div></td> <td><div align="center">5</div></td> </tr> <tr> <td colspan="3"> <div align="center"> <input type="button" name="btn_del" id="btn_del" value="删 除" onclick="del_tbl('list','del')"/> </div></td> </tr> </table> </form> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

微信小程序使用map组件实现解析经纬度功能示例
这篇文章主要介绍了微信小程序使用map组件实现解析经纬度功能,涉及微信小程序map组件结合高德地图进行经纬度获取相关操作技巧,需要的朋友可以参考下
2019-01-01
TypeScript中Map对象使用及Map与字典的区别详解
Map对象主要的应用场景在于数据重组和数据储存,下面这篇文章主要给大家介绍了TypeScript中Map对象使用及Map与字典的区别的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
2024-01-01
Mysql内储存JSON字符串根据条件进行查询
本文主要介绍了Mysql内储存JSON字符串根据条件进行查询，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-02-02
JavaScript轻松创建级联函数的方法示例
级联函数也叫链式函数，方法链一般适合对一个对象进行连续操作 (集中在一句代码)。一定程度上可以减少代码量，缺点是它占用了函数的返回值。下面这篇文章主要给大家介绍了利用JavaScript如何轻松创建级联函数的方法示例,需要的朋友可以参考借鉴。
2017-02-02
JS简单实现DIV相对于浏览器固定位置不变的方法
这篇文章主要介绍了JS简单实现DIV相对于浏览器固定位置不变的方法,涉及javascript针对页面位置的运算与动态变换技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2016-06-06
JavaScript随机排序(随即出牌)
JavaScript随机排序，自动抽取中文与英文字母，重新组合并随机排序，生成随机数很可以。
2010-09-09
w3c编程挑战_初级脚本算法实战篇
下面小编就为大家带来一篇w3c编程挑战_初级脚本算法实战篇。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-06-06
解决JSON.stringify()自动将中文转译成unicode的问题
下面小编就为大家分享一篇解决JSON.stringify()自动将中文转译成unicode的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-01-01
微信小程序实现多列选择器
这篇文章主要为大家详细介绍了微信小程序实现多列选择器，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07
js案例之鼠标跟随jquery版(实例讲解)
下面小编就为大家带来一篇js案例之鼠标跟随jquery版(实例讲解)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-07-07