table.insertRow

Résumé

insertRow ajoute une nouvelle ligne dans une table.

Syntaxe

var ligne = HTMLTableElement.insertRow(optionel index = -1);

• HTMLTableElement est une référence à un élément HTML table.
• index est l'index de ligne de la nouvelle ligne.
• ligne contiendra la référence à l'élément HTML de la nouvelle ligne.
  Si l'index est -1 ou est égal au nombre de lignes, la ligne est ajoutée à la dernière place. Si index est plus grand que le nombre de lignes, une exception IndexSizeError sera générée. Si index n'est pas précisé, sa  valeur par défaut sera -1.
• Si une table a plusieurs éléments tbody, par défaut, la nouvelle ligne est ajoutée dans le dernier tbody. Pour ajouter une ligne à un tbody en particulier:
  var specific_tbody=document.getElementById(tbody_id);
var ligne=specific_tbody.insertRow(index)

Exemple

<table id="TableA">
<tr>
<td>Ancienne ligne en haut</td>
</tr>
</table>
<script type="text/javascript">

function ajouteLigne(tableID) {
  // Récupération d'une reference à la table
  var tableRef = document.getElementById(tableID);

  // Ajoute une ligne dans la table à la position 0
  var nouvelleLigne   = tableRef.insertRow(0);

  // Ajoute une cellule dans la ligne à la position 0
  var nouvelleCellule  = nouvelleLigne.insertCell(0);

  // Ajoute un noeud text à la cellule
  var nouveauTexte  = document.createTextNode('Nouvelle ligne en haut')
  nouvelleCellule.appendChild(nouveauTexte);
}

// Appelle ajouteLigne() avec l'ID d'une table
ajouteLigne('TableA');

</script>

Pour être valide dans un document HTML, un élement TR doit avoir au moins un élément TD.

Remarquez que insertRow ajoute directement la ligne dans la table et renvoie une référence à cette nouvelle ligne. La ligne n'a pas besoin d'être ajoutée séparement comme c'est le cas quand document.createElement() est utilisé pour créer un nouvel élement TR.

Support des Navigateurs

Notes spécifique à Gecko

• À partir de la version Gecko 20.0 (Firefox 20.0 / Thunderbird 20.0 / SeaMonkey 2.17) l'argument index a été rendu optionnel et vaut par défaut -1 comme dans les spécifications HTML.

Spécification

• DOM Level 2 HTML: insertRow
• HTML Living Standard: HTMLTableElement.insertRow