HTMLTableRowElement: thuộc tính rowIndex

Baseline Widely available

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

Thuộc tính chỉ đọc rowIndex của giao diện HTMLTableRowElement đại diện cho vị trí của một hàng trong toàn bộ <table>.

Dù các phần tử <thead>, <tbody> và <tfoot> bị sắp xếp không theo thứ tự trong HTML, trình duyệt vẫn hiển thị bảng theo đúng thứ tự. Do đó, các hàng được đếm từ <thead> đến <tbody>, từ <tbody> đến <tfoot>.

<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);
});