ARIA: aria-expanded 屬性
aria-expanded 屬性被設定在一個元素上，用於指示一個控制元件是展開還是摺疊狀態，以及受控元素是否可見或隱藏。
描述
有幾種可以展開和摺疊的元件，包括選單、對話方塊和手風琴面板。這些物件中的每一個，反過來，都有一個控制其開啟和關閉的互動式元素。aria-expanded 屬性應用於這個可聚焦的、互動式的控制元件，該控制元件用於切換物件的可見性。
例如，aria-expanded 被應用於 DOM 樹中的父項，以指示其子分支是否顯示。父項也控制著關聯子分支的可見性。
有兩種宣告可以應用於控制另一個物件可見性的物件：aria-controls，或者 aria-owns 結合 aria-expanded。aria-controls 和 aria-owns 指示了控制元素和受控元素之間的關係。aria-expanded 則指示輔助技術，受控元素是展開還是摺疊狀態。
在擁有可展開分組容器的元素上使用 aria-owns 屬性。如果可展開和可摺疊的分組容器不被具有 aria-expanded 屬性的元素擁有，則使用 aria-controls 屬性來引用分組容器。
按鈕
用於切換元件的按鈕應將 aria-controls 設定為被切換元件的 id，並將 aria-expanded 設定為元件的當前狀態。
<button aria-expanded="false" aria-controls="widget1">Toggle widget</button>
當元件可見時，控制物件透過設定 aria-expanded="true" 來傳遞該資訊。控制物件的無障礙名稱應反映此更改。
<button aria-expanded="true" aria-controls="widget1">Toggle widget</button>
Menu
當顯示 menu 時，用於切換該選單可見性的按鈕物件被設定為 aria-expanded="true"。當選單隱藏時，可以省略 aria-expanded。如果指定了選單隱藏時的狀態，應設定為 aria-expanded="false"。當子選單不可見時，其父 menuitem 具有 aria-expanded 屬性。當子選單可見時，應設定為 true。
Combobox
預設情況下，某些角色是隱藏或摺疊的，而其他角色是開啟或展開的。具有 combobox 角色的元素，aria-expanded 的預設值為 false。當 combobox 彈出視窗不可見時，具有 combobox 角色的元素將 aria-expanded 設定為 false。這是預設狀態。當彈出元素可見時，aria-expanded 應設定為 true。
<label for="username">Username</label>
<input id="username" name="username" aria-describedby="username-desc" />
<button
aria-expanded="false"
aria-controls="username-desc"
aria-label="Help about username"
type="button">
<span aria-hidden="true">?</span>
</button>
<p id="username-desc" hidden>
Your username is the name that you use to log in to this service.
</p>
注意： aria-expanded 屬性的存在表示了控制關係。避免將其應用於不控制其他元素展開狀態的元素。
Treeitems
每個具有 treeitem 角色的元素，如果作為父節點，在節點處於關閉狀態時設定為 aria-expanded="false"，在節點處於開啟狀態時設定為 aria-expanded="true"。葉子節點（沒有子節點的節點）不應具有 aria-expanded 屬性，因為如果擁有該屬性，它們將被錯誤地描述為輔助技術中的父節點。
Rows
treegrid 中的父行是一個可以展開或摺疊以顯示或隱藏表格或網格中子行集的行。每個父行將 aria-expanded 狀態設定在行元素本身或行中的一個單元格上。當子行隱藏時，設定為 aria-expanded="false"。當子行顯示時，設定為 aria-expanded="true"。不控制子行顯示的行不應包含 aria-expanded 屬性，因為包含該屬性會錯誤地將這些行定義為父行。
值
false-
此元素擁有或控制的分組元素已摺疊。
true-
此元素擁有或控制的分組元素已展開。
undefined（預設值）-
該元素不擁有或控制任何可展開的分組元素。
相關介面
Element.ariaExpanded-
Element介面的一部分ariaExpanded屬性，反映了aria-expanded屬性的值。 ElementInternals.ariaExpanded-
ElementInternals介面的一部分ariaExpanded屬性，反映了aria-expanded屬性的值。
相關角色
用於角色
繼承至角色
規範
| 規範 |
|---|
| 無障礙富網際網路應用程式 (WAI-ARIA) # aria-expanded |
另見
aria-controlsaria-ownsaria-hidden- HTML
hidden屬性