HTMLTableRowElement: 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.

We'd love to hear more about your role and the company you work for

Please help us by answering a few questions.

HTMLTableRowElement.rowIndex は読み取り専用プロパティで、表 (<table>) 全体に対する行の相対的な位置を表します。

<thead>、<tbody>、<tfoot> の各要素が HTML の中で順不同であっても、ブラウザーは表を正しい順序で描画します。従って行のカウントは <thead> から <tbody> へ、 <tbody> から <tfoot> へと進みます。

値

行の位置を返します。行が表に所属していない場合は -1 です。

例

この例は、 JavaScript を使用して表のすべての行に行番号を振ります。

HTML

html

<table>
  <thead>
    <tr>
      <th>品目</th>
      <th>価格</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>バナナ</td>
      <td>$2</td>
    </tr>
    <tr>
      <td>オレンジ</td>
      <td>$8</td>
    </tr>
    <tr>
      <td>トップサーロイン</td>
      <td>$20</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>合計</td>
      <td>$30</td>
    </tr>
  </tfoot>
</table>

JavaScript

let rows = document.querySelectorAll("tr");

rows.forEach((row) => {
  let z = document.createElement("td");
  z.textContent = `(#${row.rowIndex} 行目)`;
  row.appendChild(z);
});

結果

ブラウザーの互換性

Report problems with this compatibility data on GitHub

	desktop					mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Internet	WebView Android	WebView on iOS
`rowIndex`

Tip: you can click/tap on a cell for more information.

Full support: Full support

値

例

HTML

JavaScript

結果

ブラウザーの互換性

Legend