ARIA：aria-level 屬性

描述

層級結構出現在標題、樹、巢狀網格、巢狀選項卡列表等中。如果 DOM 的祖先關係不能準確地表示層級，則應使用 aria-level 屬性來定義其層級結構中元素的層級。層級隨著深度的增加而增加。aria-level 的值是一個大於或等於 1 的整數。

在文件結構中，你可以有一級標題、二級標題、三級標題等等。在樹中，你有根元素、它的子元素、子元素的子元素（或孫子元素），依此類推。

aria-level 屬性將層級結構暴露給輔助技術，以便使用者可以獲得這些資訊。與所有 ARIA 屬性一樣，它對使用者代理沒有影響，因此對使用者代理確定文件結構也沒有影響。

如果 DOM 的祖先關係能夠準確地表示層級，那麼使用者代理就可以從文件結構中計算出某個項的層級，這使得 aria-level 不僅是多餘的，而且有產生錯誤資訊的風險。aria-level 實際上只應用於在無法從文件結構中計算出層級時，明確指示層級。請測試以確定是否需要此屬性。如果使用者代理可以計算層級，最好省略 aria-level 屬性。

與 `heading` 角色配合使用

aria-level 屬性是 heading 角色的一個必需屬性，它向輔助技術表明該元素應被視為一個標題。<div role="heading" aria-level="1"> 將 <div> 定義為頁面的主標題。一個二級標題，使用 aria-level="2" 定義，將是第一個子部分，三級標題是該子部分的子部分，依此類推。

html

<div role="heading" aria-level="3">Heading for this sub section</div>

建議改用 h1 到 h6 元素。

在 `treegrid` 角色內部

對於 treegrid，aria-level 支援具有 row 角色的元素，而不是具有 gridcell 角色的元素。行在網格的垂直方向上充當葉節點。網格單元格在每行的水平方向上是葉節點。aria-level 不支援行內的單元格。因此，在 treegrids 中，aria-level 屬性應用於具有 row 角色的元素。

如果由於使用者在樹中移動焦點或滾動而導致 DOM 中不存在一組完整的可用節點（透過動態載入），則每個節點都包含 aria-level、aria-setsize 和 aria-posinset。