aria-sort

如果網格或表提供排序功能，則應在排序列或行的表頭單元格元素上將 aria-sort 屬性設定為 ascending 或 descending（或 other）。

aria-sort 屬性僅設定在當前排序的列或行上。設定 aria-sort="ascending" 以指示該列或行中的資料單元格按升序排序。如果排序順序反轉，則將值切換到 aria-sort="descending"。當不同的列或行開始排序時，單個 aria-sort 屬性將移動到新排序列或行的表頭單元格，並使用排序順序的相應值。

aria-sort 屬性一次只能新增到單個表或網格表頭。設定該屬性是為了通知輔助技術使用者哪些列或行已排序。它對實際排序順序沒有任何影響。

此表載入時，姓氏列按升序排序。

<table>
  <caption>
    Steering Committee Members
  </caption>
  <thead>
    <tr>
      <th>
        <button>First Name</button>
      </th>
      <th aria-sort="ascending">
        <button>Last Name</button>
      </th>
      <th>
        <button>Company</button>
      </th>
      <th>Email</th>
    </tr>
  </thead>
  <tbody>
    …
  </tbody>
</table>

如果使用者單擊“姓氏”按鈕，則會將 aria-pressed="true" 新增到 <button> 元素，並使用 JavaScript 將 aria-sort 值切換到 "descending"。如果使用者單擊不同的表頭按鈕，則會從“姓氏”表頭中刪除 aria-sort，並將其放置在所單擊按鈕的 <th> 父元素上。

我們在標題中提供了說明，供可能看不到我們使用 CSS 針對 th[aria-sort="ascending"] 和 th[aria-sort="descending"] 選擇器新增的向下箭頭。

ascending

此列按升序排序專案。

descending

此列按降序排序專案。

none（預設值）

此列未應用任何已定義的排序。

other

已應用除升序或降序之外的排序演算法。

Element.ariaSort

作為 Element 介面一部分的 ariaSort 屬性反映 aria-sort 屬性的值。

ElementInternals.ariaSort

作為 ElementInternals 介面一部分的 ariaSort 屬性反映 aria-sort 屬性的值。

在角色中使用

• columnheader
• rowheader

• 可排序表格示例 -W3C
• aria-pressed
• <th> 元素