Supprimer toutes les lignes d'un tableau HTML

Comment puis-je supprimer toutes les lignes d'un tableau HTML à l'exception <th>de celles qui utilisent Javascript, et sans parcourir toutes les lignes du tableau? J'ai une très grande table et je ne veux pas geler l'interface utilisateur pendant que je parcourt les lignes pour les supprimer

Gardez la <th>ligne dans a <thead>et les autres lignes dans a, <tbody>puis remplacez le <tbody>par un nouveau, vide.

c'est à dire

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

cela supprimera toutes les lignes:

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

Très brut, mais cela fonctionne aussi:

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

C'est une vieille question, mais j'ai récemment eu un problème similaire.
J'ai écrit ce code pour le résoudre:

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

Cela supprimera toutes les lignes, sauf la première.

À votre santé!

Points à noter, à l' affût des erreurs courantes :

Si votre index de départ est 0 (ou un index du début), le code correct est:

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

REMARQUES

1. l'argument de deleteRow est fixe,
ceci est nécessaire car lorsque nous supprimons une ligne, le nombre de lignes diminue.
c'est à dire; au moment où j'atteins (rows.length - 1), ou même avant que cette ligne ne soit déjà supprimée, vous aurez donc une erreur / exception (ou une erreur silencieuse).

2. le rowCount est pris avant le début de la boucle for car à mesure que nous supprimons le "table.rows.length" continuera à changer, donc encore une fois vous avez un problème, que seules les lignes impaires ou paires sont supprimées.

J'espère que cela pourra aider.

En supposant que vous n'ayez qu'une seule table afin de pouvoir la référencer avec uniquement le type. Si vous ne souhaitez pas supprimer les en-têtes:

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

autrement:

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

J'espère que ça aide!

J'avais besoin de supprimer toutes les lignes à l'exception de la première et de la solution publiée par @strat mais cela a abouti à une exception non interceptée (référençant Node dans un contexte où il n'existe pas). Ce qui suit a fonctionné pour moi.

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

Si vous pouvez déclarer un IDfor, tbodyvous pouvez simplement exécuter cette fonction:

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

cela fonctionnerait la suppression d'itération dans le tableau HTML en natif

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

le code ci-dessous fonctionne très bien. Il supprime toutes les lignes sauf la ligne d'en-tête. Donc ce code vraiment t

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

Assing some id to tbody tag. c'est à dire . Après cela, la ligne suivante doit conserver l'en-tête / pied de page du tableau et supprimer toutes les lignes.

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

Et, si vous voulez que la table entière (en-tête / lignes / pied de page) soit effacée, définissez l'ID au niveau de la table, c'est-à-dire

Si vous ne souhaitez pas supprimer thet que vous souhaitez simplement supprimer les lignes à l'intérieur, cela fonctionne parfaitement.

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

Que dis-tu de ça:

Lorsque la page se charge pour la première fois, procédez comme suit:

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

Ensuite, lorsque vous souhaitez vider le tableau:

myTable.innerHTML=myTable.oldHTML;

Le résultat sera votre (vos) ligne (s) d'en-tête si c'est tout ce que vous avez commencé, les performances sont considérablement plus rapides que la boucle.

Si vous avez beaucoup moins de <th>lignes que de non- <th>lignes, vous pouvez rassembler toutes les <th>lignes dans une chaîne, supprimer la table entière, puis écrire <table>thstring</table>où la table se trouvait auparavant.

EDIT: Où, évidemment, "thstring" est le code HTML pour toutes les lignes de <th>s.

Cela fonctionne dans IE sans même avoir à déclarer une var pour la table et supprimera toutes les lignes:

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

c'est un code simple que je viens d'écrire pour résoudre ce problème, sans supprimer la ligne d'en-tête (la première).

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

J'espère que ça marche pour toi!!.

Attribuez un identifiant ou une classe à votre corps.

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

Vous pouvez nommer votre identifiant ou votre classe comme vous le souhaitez, pas nécessairement #tbodyIdou .tbodyClass.

Effacez simplement le corps de la table.

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

table const = document.querySelector ('table'); table.innerHTML === ''? null: table.innerHTML = ''; le javascript ci-dessus a bien fonctionné pour moi. Il vérifie si le tableau contient des données, puis efface tout, y compris l'en-tête.