Description
A type of list that may contain sub-level nested groups that can be collapsed and expanded.
To be keyboard accessible, authors SHOULD manage focus of descendants for all instances of this role, as described in Managing Focus.
Elements with the role tree have an implicit aria-orientation value of vertical.
Example
HTML Example
In the following code sample, because the anchor (HTML a element) is acting as the treeitem, the list item (HTML li element) is assigned an explicit WAI-ARIA role of presentation to override the user agent’s implicit native semantics for list items.
<ul role=”tree”>
<li role=”presentation”>
<a role=”treeitem” aria-expanded=”true”>An expanded tree node</a>
</li>
…
</ul>
Characteristics
Superclass Role
- select
Subclass Roles
- treegrid
Required Owned Elements
- group → treeitem
- treeitem
Supported States and Properties
- aria-multiselectable
- aria-required
Inherited States and Properties
- aria-activedescendant
- aria-atomic
- aria-busy (state)
- aria-controls
- aria-current (state)
- aria-describedby
- aria-details
- aria-disabled (state)
- aria-dropeffect
- aria-errormessage
- aria-expanded (state)
- aria-flowto
- aria-grabbed (state)
- aria-haspopup
- aria-hidden (state)
- aria-invalid (state)
- aria-keyshortcuts
- aria-label
- aria-labelledby
- aria-live
- aria-orientation
- aria-owns
- aria-relevant
- aria-roledescription
Name From
- author
Accessible Name Required
- True
Implicit Value for Role
- Default for aria-orientation is vertical
Semantic HTML
No HTML element equivalent.
Reference
- W3C (opens new window)