Javascript 删除 HTML 表格中的所有行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7271490/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Delete all rows in an HTML table
提问by K''
How can I delete all rows of an HTML table except the <th>'s using Javascript, and without looping through all the rows in the table? I have a very huge table and I don't want to freeze the UI while I'm looping through the rows to delete them
如何<th>使用 Javascript删除 HTML 表中除'之外的所有行，并且不循环遍历表中的所有行？我有一个非常大的表，我不想在遍历行以删除它们时冻结 UI
采纳答案by Quentin
Keep the <th>row in a <thead>and the other rows in a <tbody>then replace the <tbody>with a new, empty one.
将<th>行保留在 a 中<thead>，将其他行保留在 a 中，<tbody>然后用<tbody>新的空行替换。
i.e.
IE
var new_tbody = document.createElement('tbody');
populate_with_new_rows(new_tbody);
old_tbody.parentNode.replaceChild(new_tbody, old_tbody)
回答by Apparao
this will remove all the rows:
这将删除所有行：
$("#table_of_items tr").remove();
回答by Marcel
Very crude, but this also works:
非常粗糙，但这也有效：
var Table = document.getElementById("mytable");
Table.innerHTML = "";
回答by cstrat
This is an old question, however I recently had a similar issue.
I wrote this code to solve it:
这是一个老问题，但是我最近遇到了类似的问题。
我写了这段代码来解决它：
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]);
}
That will remove all rows, except the first.
这将删除所有行，除了第一行。
Cheers!
干杯!
回答by Manohar Reddy Poreddy
Points to note, on the Watch out for common mistakes:
注意事项，注意常见错误：
If your start index is 0 (or some index from begin), then, the correct code is:
如果您的起始索引为 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);
}
NOTES
笔记
1. the argument for deleteRow is fixed
this is required since as we delete a row, the number of rows decrease.
i.e; by the time i reaches (rows.length - 1), or even before that row is already deleted, so you will have some error/exception (or a silent one).
1. deleteRow 的参数是固定的，
这是必需的，因为当我们删除一行时，行数会减少。
IE; 当我到达 (rows.length - 1) 时，或者甚至在该行已被删除之前，您将遇到一些错误/异常（或无提示）。
2. the rowCount is taken before the for loop startssince as we delete the "table.rows.length" will keep on changing, so again you have some issue, that only odd or even rows only gets deleted.
2. rowCount 在 for 循环开始之前被采用，因为当我们删除“table.rows.length”时，“table.rows.length”会不断变化，所以你又遇到了一些问题，只有奇数行或偶数行才会被删除。
Hope that helps.
希望有帮助。
回答by Francisco López-Sancho
Assuming you have just one table so you can reference it with just the type. If you don't want to delete the headers:
假设您只有一张表，因此您可以仅使用类型来引用它。如果您不想删除标题：
$("tbody").children().remove()
otherwise:
除此以外：
$("table").children().remove()
hope it helps!
希望能帮助到你！
回答by OSB
If you can declare an IDfor tbodyyou can simply run this function:
如果你可以声明一个IDfortbody你可以简单地运行这个函数：
var node = document.getElementById("tablebody");
while (node.hasChildNodes()) {
node.removeChild(node.lastChild);
}
回答by lkan
I needed to delete all rows except the first and solution posted by @strat but that resulted in uncaught exception (referencing Node in context where it does not exist). The following worked for me.
我需要删除除@strat 发布的第一行和解决方案之外的所有行，但这导致未捕获的异常（在不存在的上下文中引用 Node）。以下对我有用。
var myTable = document.getElementById("myTable");
var rowCount = myTable.rows.length;
for (var x=rowCount-1; x>0; x--) {
myTable.deleteRow(x);
}
回答by sid
the give below code works great. It removes all rows except header row. So this code really t
下面给出的代码效果很好。它删除除标题行之外的所有行。所以这段代码真的很棒
$("#Your_Table tr>td").remove();
回答by HuntsMan
this would work iteration deletetion in HTML table in native
这将在本机的 HTML 表中进行迭代删除
document.querySelectorAll("table tbody tr").forEach(function(e){e.remove()})
