HTML DOM TableRow sectionRowIndex 属性

sectionRowIndex 属性返回行在其所在表格区段中的下标索引。该属性是只读属性。

语法

tableRow.sectionRowIndex

返回值

• 返回一个整数，表示表格中当前行在其所在区段的下标索引。

示例

HTML

<table>
  <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>张三</td>
      <td>18</td>
      <td>男</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>20</td>
      <td>男</td>
    </tr>
    <tr>
      <td>王五</td>
      <td>22</td>
      <td>女</td>
    </tr>
  </tbody>
</table>

JavaScript

const table = document.querySelector('table');
const rows = table.getElementsByTagName('tr');

for (let i = 0; i < rows.length; i++) {
  console.log(rows[i].sectionRowIndex);
}

输出结果

-1
0
1
2

上面的示例中，console.log(rows[i].sectionRowIndex) 输出了每一行在其所在区段的下标索引。

要注意的是，表格的 thead、tbody、tfoot 都是区段(section)。在 thead 中的行 sectionRowIndex 属性值为 -1，因为它不属于区段。在其他 section 中的行的 sectionRowIndex 属性值从 0 开始计数。

总结

sectionRowIndex 属性可以获取表格中当前行在其所在区段的下标索引。对于复杂的表格操作，如增加、删除行等，该属性可以方便的操作行的位置。