HTMLTableRowElement: rowIndex-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨Juli 2015⁩.

Die rowIndex-Eigenschaft der HTMLTableRowElement-Schnittstelle ist eine schreibgeschützte Eigenschaft, die die Position einer Zeile innerhalb der gesamten <table> darstellt.

Selbst wenn die <thead>, <tbody> und <tfoot>-Elemente in der HTML-Datei außerhalb der Reihenfolge stehen, rendern Browser die Tabelle in der richtigen Reihenfolge. Daher werden die Zeilen von <thead> zu <tbody>, von <tbody> zu <tfoot> gezählt.

<table>
 <thead>
 <tr>
 <th>Item</th>
 <th>Price</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>Bananas</td>
 <td>2ドル</td>
 </tr>
 <tr>
 <td>Oranges</td>
 <td>8ドル</td>
 </tr>
 <tr>
 <td>Top Sirloin</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 = `(row #${row.rowIndex})`;
 row.appendChild(z);
});