删除HTML表中的所有行

Question

如何删除HTML表的所有行,除了<th>使用Javascript,并且不循环遍历表中的所有行？我有一个非常庞大的表,我不想在我循环删除它们时冻结UI

Answer 1

这将删除所有行:

$("#table_of_items tr").remove(); 

Answer 2

将<th>行保留在a <thead>和其他行中,<tbody>然后用<tbody>新的空行替换.

即

var new_tbody = document.createElement('tbody');
populate_with_new_rows(new_tbody);
old_tbody.parentNode.replaceChild(new_tbody, old_tbody)

Answer 3

非常粗糙,但这也有效:

var Table = document.getElementById("mytable");
Table.innerHTML = "";

Answer 4

这是一个老问题,但我最近遇到了类似的问题.
我写了这段代码来解决它:

var elmtTable = document.getElementById('TABLE_ID_HERE');
var tableRows = elmtTable.getElementsByTagName('tr');
var rowCount = tableRows.length;

for (var x=rowCount-1; x>0; x--) {
   elmtTable.removeChild(tableRows[x]);
}

这将删除除第一行之外的所有行.

干杯!

Answer 5

注意事项,关于常见错误:

如果你喜欢代码从0开始索引(或从开始的某个索引),

那么,正确的解决方案是:

var tableHeaderRowCount = 1;
var table = document.getElementById('WRITE_YOUR_HTML_TABLE_NAME_HERE');
var rowCount = table.rows.length;
for (var i = tableHeaderRowCount; i < rowCount; i++) {
    table.deleteRow(tableHeaderRowCount);
}

1. deleteRow的参数是固定的

这是必需的,因为当我们删除一行时,行数减少.
即; 到达(rows.length - 1)时,甚至在该行已被删除之前,您将有一些错误/异常(或一个无声的).

2.在for循环开始之前获取rowCount

因为当我们删除"table.rows.length"将继续改变,所以再次你有一些问题,只有奇数或偶数行才会被删除.

注意这些,节省时间,祝你好运.

Answer 6

假设您只有一个表,那么您可以仅使用类型引用它.如果您不想删除标题:

$("tbody").children().remove()

除此以外:

$("table").children().remove()

希望能帮助到你!

Answer 7

下面给出的代码效果很好。它删除除标题行之外的所有行。所以这段代码真的很棒

$("#Your_Table tr>td").remove();

Answer 8

我需要删除除@strat发布的第一个和解决方案之外的所有行,但这会导致未捕获的异常(在不存在的情况下引用节点).以下对我有用.

var myTable = document.getElementById("myTable");
var rowCount = myTable.rows.length;
for (var x=rowCount-1; x>0; x--) {
   myTable.deleteRow(x);
}

Answer 9

这个怎么样：

当页面首次加载时，执行以下操作：

var myTable = document.getElementById("myTable");
myTable.oldHTML=myTable.innerHTML;

然后当你想清除表时：

myTable.innerHTML=myTable.oldHTML;

如果您一开始就是这样，结果将是您的标题行，性能比循环快得多。

Answer 10

如果你可以声明一个IDfor,tbody你可以简单地运行这个函数:

var node = document.getElementById("tablebody");
while (node.hasChildNodes()) {
  node.removeChild(node.lastChild);
}

Answer 11

为 tbody 标签分配一些 id。IE 。此后，以下行应保留表页眉/页脚并删除所有行。

document.getElementById("yourID").innerHTML="";

并且，如果您希望清除整个表（页眉/行/页脚），请在表级别设置 id，即

Answer 12

这将在本机的 HTML 表中进行迭代删除

document.querySelectorAll("table tbody tr").forEach(function(e){e.remove()})