12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
ADADADADAD
编程知识 时间:2024-12-18 16:48:28
作者:文/会员上传
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
12-09
如果你经常操作表格,那么你一定会遇到删除表格中某一行的需求。而这时,javascript的删除tr行就是你最好的选择。首先,我们来看一下如何删除一个表格中已经存在的某一个行。var
以下为本文的正文内容,内容仅供参考!本站为公益性网站,复制本文以及下载DOC文档全部免费。
如果你经常操作表格,那么你一定会遇到删除表格中某一行的需求。而这时,javascript的删除tr行就是你最好的选择。
首先,我们来看一下如何删除一个表格中已经存在的某一个行。
var table = document.getElementById("table-id");table.deleteRow(2);
上述代码中,“table-id”是你所希望删除的表格的id。这里我们使用了deleteRow函数来删除表格中的第二行(行数从0开始),你只需要将表格中你想删除的行数替换即可。
当然,如果你想通过点击按钮来实现删除表格行的操作,我们还可以通过以下代码来实现:
<table id="table-id"><tbody><tr><td>第一行第一格</td><td>第一行第二格</td><td><input type='button' value='删除' onclick='deleteRow(this);'></td></tr><tr><td>第二行第一格</td><td>第二行第二格</td><td><input type='button' value='删除' onclick='deleteRow(this);'></td></tr></tbody></table><script>function deleteRow(btn) {var row = btn.parentNode.parentNode;row.parentNode.removeChild(row);}</script>
上述代码中,我们通过给每一个删除按钮绑定一个函数,实现了点击按钮删除其所在行的功能。代码中注释已经十分详细,同学们能很快理解并应用到自己的工作当中。
当然,我们不仅可以删除表格中特定行,还可以通过以下代码删除表格中所有行:
var table = document.getElementById("table-id");var rows = table.rows;var rowIndex = rows.length - 1;while (rowIndex >= 0) {table.deleteRow(rowIndex);rowIndex = rowIndex - 1;}
上述代码中,我们首先获取了整个表格元素,然后通过使用table.rows获取了表格的所有行。最后,我们通过while循环遍历并删除每一行,直到删除完为止。
总之,javascript删除tr操作是应用非常广泛的javascript编程技巧,可以轻松实现给定表格中的行删除和清空等操作。上述代码也许只是许多操作之一,但希望它能帮助每一个想要学习javascript删除tr操作的同学们。
11-20
11-19
11-20
11-20
11-20
11-19
11-20
11-20
11-19
11-20
11-19
11-19
11-19
11-19
11-19
11-19