Подтвердить что ты не робот

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

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

4b9b3361

Ответ 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)

Ответ 2

это приведет к удалению всех строк:

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

Ответ 3

Очень грубо, но это также работает:

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

Ответ 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]);
}

Это приведет к удалению всех строк, кроме первого.

Ура!

Ответ 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" будет продолжать меняться, так что снова у вас есть проблема, что удаляются только нечетные или четные строки.

Следите за ними, экономьте время, удачи.

Ответ 6

Предполагая, что у вас есть только одна таблица, поэтому вы можете ссылаться на нее только с типом. Если вы не хотите удалять заголовки:

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

иначе:

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

надеюсь, что это поможет!

Ответ 7

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

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

Ответ 8

Мне нужно было удалить все строки, кроме первого, и решение, отправленное @strat, но это привело к неперехваченному исключению (ссылаясь на Node в контексте, где он не существует). Следующие работали для меня.

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

Ответ 9

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

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

Ответ 10

Если у вас гораздо меньше строк <th>, чем не <th>, вы можете собрать все строки <th> в строку, удалить всю таблицу и затем написать <table>thstring</table>, где использовалась таблица.

EDIT: где, очевидно, "thstring" - это html для всех строк <th> s.

Ответ 11

Это работает в IE, даже не объявляя var для таблицы и удаляя все строки:

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

Ответ 12

это простой код, который я только что написал, чтобы решить эту проблему, не удаляя строку заголовка (первая).

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

Надеюсь, что это сработает для вас!

Ответ 13

Если вы не хотите удалять th и просто хотите удалить строки внутри, это работает отлично.

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

Ответ 14

это приведет к удалению итерации в таблице HTML в native

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

Ответ 15

Просто очистите тело таблицы.

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

Ответ 16

Как насчет этого:

Когда страница загружается первой, сделайте следующее:

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

Затем, когда вы хотите очистить таблицу:

myTable.innerHTML=myTable.oldHTML;

Результатом будет ваша строка заголовка, если все, с чего вы начали, производительность значительно быстрее, чем цикл.

Ответ 17

Назначьте идентификатор или класс для вашего тела.

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

Вы можете назвать свой идентификатор или класс так, как хотите, не обязательно #tbodyId или .tbodyClass.

Ответ 18

За исключением Header и Footer вы используете этот код для удаления Body.

$("#YourTableId tr").not(':first, :last').remove();