ARIA：aria-colindextext 属性

描述

当您有一个非常大的表格或故意只想显示表格的一部分时，并非所有列都可能存在于 DOM 中。在这种情况下，我们使用具有整数值的 aria-colcount 来定义如果所有列都存在，表格（或网格）将有多少列，并在每列上添加 aria-colindex 属性，以提供有关该较大数据列索引的信息。

在以下 HTML 代码片段中，我们的表格有 8 列，但我们只显示了 4 列。“city”列是我们较大表格的第五列，由 aria-colindex="5" 定义。

html

<table aria-colcount="8">
  <thead>
    <tr>
      <th aria-colindex="1" scope="col">First name</th>
      <th aria-colindex="2" scope="col">Last name</th>
      <th aria-colindex="5" scope="col">City</th>
      <th aria-colindex="7" scope="col">Zip</th>
    </tr>
  </thead>
  …
</table>

这个表格并不复杂。如果这是一个拥有 100 多列的电子表格或一个没有列标题的网格，例如棋盘，那么提供的或计算的 aria-colindex 值可能没有意义，或者可能无法反映显示的索引。在这种情况下，可以包含 aria-colindextext。该值是一个字符串，是对数字 aria-colindex 的人类可读文本替代。

html

<table aria-colcount="128">
  <thead>
    <tr>
      <th aria-colindex="1" aria-colindextext="NYSE stock symbol" scope="col">
        NYSE
      </th>
      <th
        aria-colindex="110"
        aria-colindextext="Value at start of 2021"
        scope="col">
        01/21
      </th>
      <th
        aria-colindex="122"
        aria-colindextext="Value at start of 2022"
        scope="col">
        01/22
      </th>
      <th aria-colindex="124" scope="col">Recommendation</th>
    </tr>
  </thead>
  …
</table>

在上面的示例中，表格有 128 列，其中只显示了 4 列。aria-colindextext 在三列中使用，以提供人类可读的文本替代。通过包含 aria-colindextext="Value at start of 2021"，辅助技术可以播报“Value at start of 2021”（2021 年初的值），而不是“Column 110”（第 110 列）。

只有当提供的或计算的 aria-colindex 值没有意义或未反映显示的索引时，才使用 aria-colindextext。每当包含 aria-colindextext 时，也要保留 aria-colindex，因为某些辅助技术依赖数字列索引来跟踪用户位置和提供替代表格导航。

注意：虽然 aria-colindex 可以添加到行中（当所有存在的列都是连续的，可以推断出顺序值时），但 aria-colindextext 不是 row 的支持属性。

请参阅相关的 aria-rowindextext。