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

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

Держите <th>строку в <thead>и других строк в <tbody>то заменить <tbody>на новый, пустой.

т.е.

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

это удалит все строки:

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

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

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

Это старый вопрос, но недавно у меня была похожая проблема.
Я написал этот код, чтобы решить эту проблему:

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]);
}

Это удалит все строки, кроме первой.

Ура!

На заметку: Остерегайтесь распространенных ошибок :

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

Надеюсь, это поможет.

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

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

в противном случае:

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

Надеюсь, поможет!

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

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

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

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

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

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

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

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

Присваивание некоторого идентификатора тегу tbody. т.е. После этого следующая строка должна сохранить верхний / нижний колонтитул таблицы и удалить все строки.

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

И, если вы хотите, чтобы вся таблица (заголовок / строки / нижний колонтитул) была стерта, установите идентификатор на уровне таблицы, т.е.

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

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

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

При первой загрузке страницы сделайте следующее:

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

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

myTable.innerHTML=myTable.oldHTML;

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

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

РЕДАКТИРОВАТЬ: Где, очевидно, «thstring» - это html для всех строк <th>s.

Это работает в IE без необходимости даже объявлять переменную для таблицы и удаляет все строки:

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

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

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

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

Присвойте своему телу идентификатор или класс.

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

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

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

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

const table = document.querySelector ('таблица'); table.innerHTML === ''? нуль: table.innerHTML = ''; приведенный выше javascript отлично работал у меня. Он проверяет, содержит ли таблица какие-либо данные, а затем очищает все, включая заголовок.