このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。
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 2015年7月.
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
js
let rows = document.querySelectorAll("tr");
rows.forEach((row) => {
let z = document.createElement("td");
z.textContent = `(#${row.rowIndex} 行目)`;
row.appendChild(z);
});
結果
[フレーム]
ブラウザーの互換性
Loading...