Удалить все строки в таблице HTML

Question

Как я могу удалить все строки таблицы HTML, кроме <th> с использованием Javascript и без циклического прохождения всех строк в таблице? У меня очень большая таблица, и я не хочу замораживать пользовательский интерфейс, пока я перебираю строки, чтобы удалить их

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

Если вы можете объявить ID для tbody, вы можете просто запустить эту функцию:

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

Answer 9

приведенный ниже код прекрасно работает.Удаляет все строки, кроме строки заголовка.Так что этот код действительно т

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

Answer 10

это будет работать удаление итерации в HTML-таблице в нативном

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