HTMLTableRowElement.rowIndex

HTMLTableRowElement.rowIndex只读属性表示一个行相对于整个位置的<table>

即使<thead><tbody> (en-US)<tfoot>}的元素在HTML中乱序显示,浏览器也会以正确的顺序。因此,行数从<thead><tbody>,从<tbody><tfoot>

句法

var index = HTMLTableRowElement .rowIndex

返回该行的索引,或者-1如果该行不属于表的一部分,则返回该索引

本示例使用JavaScript标记表中的所有行号。

的HTML

<表格>
  <thead>
    <tr> <th>商品</ th> <th>价格</ th> </ tr>
  </ thead>
  <身体>
    <tr> <td>香蕉</ td> <td> $ 2 </ td> </ tr>
    <tr> <td>橙色</ td> <td> $ 8 </ td> </ tr>
    <tr> <td>顶级沙朗</ td> <td> $ 20 </ td> </ tr>
  </ tbody>
  <>
    <tr> <td>总计</ td> <td> $ 30 </ td> </ tr>
  </ tfoot>
</ table>

的JavaScript

让行= document.querySelectorAll('tr';

rows.forEach((row)=> {
  让z = document.createElement(“ td”);
  z.textContent =`(row#$ {row.rowIndex})`;
  row.appendChild(z);
};

结果

浏览器兼容性

BCD tables only load in the browser