Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
HTMLTableRowElement : propriété rowIndex
Baseline
Large disponibilité
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
<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
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
| Spécification |
|---|
| HTML # dom-tr-rowindex-dev |
Compatibilité des navigateurs
Activez JavaScript pour afficher ce tableau de compatibilité des navigateurs.
Voir aussi
- La propriété
HTMLTableRowElement.sectionRowIndex
Aider à améliorer MDN
Cette page a été modifiée le par les contributeur·ice·s du MDN.