删除HTML表中的所有行

Question

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

Answer 1

将<th>行保留在<thead>中，将其他行保留在<tbody>中，然后将<tbody>替换为新的空行。

即

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

Answer 2

这将删除所有行：

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

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。 rowCount在for循环开始之前获取

因为当我们删除“table.rows.length”时会继续更改，所以再次遇到一些问题，只有奇数行或偶数行才会被删除。

注意这些，节省时间，祝你好运。

Answer 6

假设您只有一个表，那么您只需使用类型即可引用它。 如果您不想删除标题：

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

否则：

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

希望它有所帮助！

Answer 7

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

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

Answer 8

如果您可以为fastlane_version "2.27.0" default_platform :ios platform :ios do lane :beta do cert sigh gym end error do |lane, exception| puts "Got an error! #{exception.error_info.to_s}" end end 声明ID，则只需运行此功能：

tbody

Answer 9

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

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

Answer 10

这在IE中工作，甚至不必为表声明var并删除所有行：

for(var i = 0; i < resultsTable.rows.length;)
{   
   resultsTable.deleteRow(i);
}

Answer 11

如果您的<th>行比非<th>行少得多，您可以将所有<th>行收集到一个字符串中，删除整个表，然后写{{1这个表曾经是。

编辑：显然，“thstring”是<table>thstring</table> s所有行的html。

Answer 12

如果您不想删除th并且只想删除内部的行，则效果非常好。

var tb = document.getElementById('tableId');
  while(tb.rows.length > 1) {
  tb.deleteRow(1);
}

Answer 13

这将在本机

的HTML表格中进行迭代删除

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

Answer 14

这是我刚刚编写的一个简单代码，用于解决此问题，而不删除标题行（第一个）。

var Tbl = document.getElementById('tblId');
while(Tbl.childNodes.length>2){Tbl.removeChild(Tbl.lastChild);}

希望它适合你!!。

Answer 15

为你的tbody分配一个id或一个类。

document.querySelector("#tbodyId").remove();
document.querySelectorAll(".tbodyClass").remove();

您可以为自己的身份或课程命名，但不一定是#tbodyId或.tbodyClass。

Answer 16

只需清理表格。

$("#tblbody").html("");

Answer 17

这个怎么样：

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

std::mutex

然后当你想要清除表格时：

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

结果将是你的标题行，如果你刚开始使用，那么性能要比循环快得多。

Answer 18

将一些ID关联到tbody标签。即此后，以下行应保留表的页眉/页脚并删除所有行。

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

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

）设置ID

Answer 19

@lkan 的 answer 对我有用，但是离开第一行，更改

来自

for (var x=rowCount-1; x>0; x--)

到

for (var x=rowCount-1; x>1; x--)

完整代码：

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

Answer 20

const table = document.querySelector（'table'）; table.innerHTML ===''？ null：table.innerHTML =''; 上面的javascript对我来说很好。它会检查表是否包含任何数据，然后清除所有内容，包括标题。