Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

HTMLTableRowElement : propriété rowIndex

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.

La propriété en lecture seule rowIndex de l'interface HTMLTableRowElement représente la position d'une ligne dans l'ensemble du <table>.

Même lorsque les éléments HTML <thead>, <tbody> et <tfoot> sont dans le désordre dans le HTML, les navigateurs affichent le tableau dans le bon ordre. Les lignes sont donc comptées de <thead> à <tbody>, puis de <tbody> à <tfoot>.

Valeur

L'index de la ligne, ou -1 si la ligne ne fait pas partie d'un tableau.

Exemples

Cet exemple utilise JavaScript pour afficher le numéro de chaque ligne dans un tableau.

HTML

html
<table>
  <thead>
    <tr>
      <th>Article</th>
      <th>Prix</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Bananes</td>
      <td>2 €</td>
    </tr>
    <tr>
      <td>Oranges</td>
      <td>8 €</td>
    </tr>
    <tr>
      <td>Filet de boeuf</td>
      <td>20 €</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>Total</td>
      <td>30 €</td>
    </tr>
  </tfoot>
</table>

JavaScript

js
const rows = document.querySelectorAll("tr");

rows.forEach((row) => {
  const z = document.createElement("td");
  z.textContent = `(ligne n°${row.rowIndex})`;
  row.appendChild(z);
});

Résultat

Spécifications

Specification
HTML
# dom-tr-rowindex-dev

Compatibilité des navigateurs

Voir aussi