HTMLTableElement

Propriétés d'instance

Hérite des propriétés de son parent, HTMLElement.

HTMLTableElement.caption

Un objet HTMLTableCaptionElement représentant le premier <caption> enfant de l'élément, ou null si aucun n'est trouvé. Lors de l'affectation, si l'objet ne représente pas un <caption>, une exception (DOMException) avec le nom HierarchyRequestError est levée. Si un objet correct est fourni, il est inséré dans l'arbre comme premier enfant de cet élément et le premier <caption> enfant de cet élément est supprimé de l'arbre, le cas échéant.

HTMLTableElement.tHead

Un objet HTMLTableSectionElement représentant le premier <thead> enfant de l'élément, ou null si aucun n'est trouvé. Lors de l'affectation, si l'objet ne représente pas un <thead>, une DOMException avec le nom HierarchyRequestError est levée. Si un objet correct est fourni, il est inséré dans l'arbre juste avant le premier élément qui n'est ni un <caption>, ni un <colgroup>, ou comme dernier enfant s'il n'y a pas un tel élément, et le premier <thead> enfant de cet élément est supprimé de l'arbre, le cas échéant.

HTMLTableElement.tFoot

Un objet HTMLTableSectionElement représentant le premier <tfoot> enfant de l'élément, ou null si aucun n'est trouvé. Lors de l'affectation, si l'objet ne représente pas un <tfoot>, une DOMException avec le nom HierarchyRequestError est levée. Si un objet correct est fourni, il est inséré dans l'arbre juste avant le premier élément qui n'est ni un <caption>, ni un <colgroup>, ni un <thead>, ou comme dernier enfant s'il n'y a pas un tel élément, et le premier <tfoot> enfant de cet élément est supprimé de l'arbre, le cas échéant.

HTMLTableElement.rows Lecture seule

Retourne une collection (HTMLCollection) dynamique contenant toutes les lignes de l'élément, c'est-à-dire tous les <tr> qui sont enfants de l'élément, ou enfants de l'un de ses <thead>, <tbody> et <tfoot> enfants. Les membres de lignes d'un <thead> apparaissent en premier, dans l'ordre de l'arbre, et ceux d'un <tbody> en dernier, également dans l'ordre de l'arbre. La HTMLCollection est dynamique et se met automatiquement à jour lorsque le HTMLTableElement change.

HTMLTableElement.tBodies Lecture seule

Retourne une collection (HTMLCollection) dynamique contenant tous les <tbody> de l'élément. La HTMLCollection est dynamique et se met automatiquement à jour lorsque le HTMLTableElement change.

Propriétés obsolètes

HTMLTableElement.align Obsolète

Une chaîne de caractères contenant une valeur énumérée reflétant l'attribut align. Elle indique l'alignement du contenu de l'élément par rapport au contexte environnant. Les valeurs possibles sont "left", "right" et "center".

HTMLTableElement.bgColor Obsolète

Une chaîne de caractères contenant la couleur de fond des cellules. Elle reflète l'attribut obsolète bgColor.

HTMLTableElement.border Obsolète

Une chaîne de caractères contenant la largeur en pixels de la bordure du tableau. Elle reflète l'attribut obsolète border.

HTMLTableElement.cellPadding Obsolète

Une chaîne de caractères contenant la largeur en pixels de l'espace horizontal et vertical entre le contenu de la cellule et les bordures de la cellule. Elle reflète l'attribut obsolète cellpadding.

HTMLTableElement.cellSpacing Obsolète

Une chaîne de caractères contenant la largeur en pixels de la séparation horizontale et verticale entre les cellules. Elle reflète l'attribut obsolète cellspacing.

HTMLTableElement.frame Obsolète

Une chaîne de caractères contenant le type de bordures externes du tableau. Elle reflète l'attribut obsolète frame et peut prendre l'une des valeurs suivantes : "void", "above", "below", "hsides", "vsides", "lhs", "rhs", "box" ou "border".

HTMLTableElement.rules Obsolète

Une chaîne de caractères contenant le type de bordures internes du tableau. Elle reflète l'attribut obsolète rules et peut prendre l'une des valeurs suivantes : "none", "groups", "rows", "cols" ou "all".

HTMLTableElement.summary Obsolète

Une chaîne de caractères contenant une description de l'objectif ou de la structure du tableau. Elle reflète l'attribut obsolète summary.

HTMLTableElement.width Obsolète

Une chaîne de caractères contenant la longueur en pixels ou en pourcentage de la largeur souhaitée de l'ensemble du tableau. Elle reflète l'attribut obsolète width.

Méthodes d'instance

Hérite des méthodes de son parent, HTMLElement.

HTMLTableElement.createTHead()

Retourne un objet HTMLTableSectionElement représentant le premier <thead> enfant de l'élément. Si aucun n'est trouvé, un nouveau est créé et inséré dans l'arbre juste avant le premier élément qui n'est ni un <caption>, ni un <colgroup>, ou comme dernier enfant s'il n'y a pas un tel élément.

HTMLTableElement.deleteTHead()

Supprime le premier <thead> enfant de l'élément.

HTMLTableElement.createTFoot()

Retourne un objet HTMLTableSectionElement représentant le premier <tfoot> enfant de l'élément. Si aucun n'est trouvé, un nouveau est créé et inséré dans l'arbre comme dernier enfant.

HTMLTableElement.deleteTFoot()

Supprime le premier <tfoot> enfant de l'élément.

HTMLTableElement.createTBody()

Retourne un objet HTMLTableSectionElement représentant un nouvel <tbody> enfant de l'élément. Il est inséré dans l'arbre après le dernier élément qui est un <tbody>, ou comme dernier enfant s'il n'y a pas un tel élément.

HTMLTableElement.createCaption()

Retourne un objet HTMLElement représentant le premier <caption> enfant de l'élément. Si aucun n'est trouvé, un nouveau est créé et inséré dans l'arbre comme premier enfant de l'élément <table>.

HTMLTableElement.deleteCaption()

Supprime le premier <caption> enfant de l'élément.

HTMLTableElement.insertRow()

Retourne un objet HTMLTableRowElement représentant une nouvelle ligne du tableau. Elle est insérée dans la collection de lignes juste avant l'élément <tr> à la position index donnée. Si nécessaire, un <tbody> est créé. Si l'index vaut -1, la nouvelle ligne est ajoutée à la fin de la collection. Si l'index est inférieur à -1 ou supérieur au nombre de lignes de la collection, une DOMException avec la valeur IndexSizeError est levée.

HTMLTableElement.deleteRow()

Supprime la ligne correspondant à l'index donné en paramètre. Si la valeur de l'index est -1, la dernière ligne est supprimée ; si elle est inférieure à -1 ou supérieure au nombre de lignes de la collection, une DOMException avec la valeur IndexSizeError est levée.

Exemples

Utilisation de l'interface DOM Table

L'interface HTMLTableElement fournit des méthodes pratiques pour créer et manipuler des tableaux. Deux méthodes fréquemment utilisées sont HTMLTableElement.insertRow et HTMLTableRowElement.insertCell.

Pour ajouter une ligne et des cellules à un tableau existant :

<table id="table0">
  <tbody>
    <tr>
      <td>Ligne 0 Cellule 0</td>
      <td>Ligne 0 Cellule 1</td>
    </tr>
  </tbody>
</table>

const table = document.getElementById("table0");
const row = table.insertRow(-1);

for (let i = 0; i < 2; i++) {
  const cell = row.insertCell(-1);
  const text = `Row ${row.rowIndex} Cell ${i}`;
  cell.appendChild(document.createTextNode(text));
}

Spécifications

Compatibilité des navigateurs

Voir aussi

• L'élément HTML qui implémente cette interface : <table>