HTMLTableRowElement.rowIndex
只读属性 HTMLTableRowElement.rowIndex
用于表示元素所在行相对于整个 <table>
的逻辑位置。
即使 <thead>
、<tbody>
和 <tfoot>
} 元素在 HTML 中乱序排列,浏览器也会以正确的顺序渲染表格。因此,行号的标记顺序为:从 <thead>
到 <tbody>
,再到 <tfoot>
。
语法
var index = HTMLTableRowElement.rowIndex
返回值
返回该行的索引,如果该行不属于表的一部分,则返回 -1
。
示例
本示例使用 JavaScript 标记表中的所有行号。
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 #${row.rowIndex})`;
row.appendChild(z);
});
结果
浏览器兼容性
BCD tables only load in the browser