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需再刷新一下页面才能执行]

您可能感兴趣的文章:

动态加载dtree.js树treeview(示例代码)
本篇文章主要是对动态加载dtree.js树treeview的示例代码进行了详细的分析介绍，需要的朋友可以过来参考下，希望对大家有所帮助
2013-12-12
JavaScript生成指定范围的时间列表
这篇文章主要介绍了JavaScript生成指定范围的时间列表思路详解,需要的朋友可以参考下
2018-03-03
JS中把函数作为另一函数的参数传递方法(总结)
下面小编就为大家带来一篇JS中把函数作为另一函数的参数传递方法(总结)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-06-06
js分片下载超出2G的大文件代码实例
为了实现断点续传,研究了js的文件分片,下面这篇文章主要给大家介绍了关于js分片下载超出2G的大文件的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
2024-04-04
原生JS实现幻灯片
本文主要介绍了原生JS实现幻灯片的示例代码，具有很好的参考价值，下面跟着小编一起来看下吧
2017-02-02
使用contextMenu插件实现Bootstrap table弹出右键菜单
如今Bootstrap这个前端框架已被许多人接受并应用在不同的项目中，其中“开发高效，设备兼容”的特点表现得非常明显。这篇文章主要介绍了使用contextMenu插件实现Bootstrap table弹出右键菜单,需要的朋友可以参考下
2017-02-02
JS匀速运动演示示例代码
匀速运动的效果想必大家都有见到过吧，在本文为大家介绍下使用JS是如何实现的，感兴趣的朋友不要错过
2013-11-11
用javascript编写的第一人称射击游戏
用javascript编写的第一人称射击游戏...
2007-02-02
es6中的import导入模块和 export导出模块详解
require 是 CommonJS 模块系统中用于导入模块的关键字,采用同步加载方式；而 import 和 export 是 ES6 模块系统中用于导入和导出模块的关键字,采用静态加载方式,并且支持异步加载,这篇文章主要介绍了es6中的import导入模块和 export导出模块,需要的朋友可以参考下
2023-11-11
JavaScript中的new的使用方法与注意事项
JavaScript中的new的使用方法与注意事项...
2007-05-05

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

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具