ARIA 状态及属性

ARIA 的状态和属性（合称为“特性”）共有 4 类：

1. 小部件（widget）特性

   • aria-autocomplete (en-US)
   • aria-checked (en-US)
   • aria-disabled (en-US)
   • aria-errormessage (en-US)
   • aria-expanded (en-US)
   • aria-haspopup (en-US)
   • aria-hidden
   • aria-invalid (en-US)
   • aria-label
   • aria-level (en-US)
   • aria-modal (en-US)
   • aria-multiline (en-US)
   • aria-multiselectable (en-US)
   • aria-orientation (en-US)
   • aria-placeholder (en-US)
   • aria-pressed (en-US)
   • aria-readonly (en-US)
   • aria-required (en-US)
   • aria-selected (en-US)
   • aria-sort (en-US)
   • aria-valuemax (en-US)
   • aria-valuemin (en-US)
   • aria-valuenow (en-US)
   • aria-valuetext (en-US)

2. 活动区域特性

   • aria-busy (en-US)
   • aria-live (en-US)
   • aria-relevant (en-US)
   • aria-atomic (en-US)

3. 拖放特性

   • aria-dropeffect (en-US)
   • aria-grabbed (en-US)

4. 关系特性

   • aria-activedescendant (en-US)
   • aria-colcount (en-US)
   • aria-colindex (en-US)
   • aria-colspan (en-US)
   • aria-controls (en-US)
   • aria-describedby (en-US)
   • aria-description (en-US)
   • aria-details (en-US)
   • aria-errormessage (en-US)
   • aria-flowto (en-US)
   • aria-labelledby
   • aria-owns (en-US)
   • aria-posinset (en-US)
   • aria-rowcount (en-US)
   • aria-rowindex (en-US)
   • aria-rowspan (en-US)
   • aria-setsize (en-US)

无论是否应用了 ARIA 角色，某些状态和属性始终适用于所有的 HTML 元素。它们被定义为“全局”特性。所有角色和基本标记元素都支持全局状态和属性。

上面所列出的许多特性都是全局的，这意味着除非被“特别禁止”，它们可以被包含在任意的元素中：

• aria-atomic (en-US)
• aria-busy (en-US)
• aria-controls (en-US)
• aria-current (en-US)
• aria-describedby (en-US)
• aria-description (en-US)
• aria-details (en-US)
• aria-disabled (en-US)
• aria-dropeffect (en-US)
• aria-errormessage (en-US)
• aria-flowto (en-US)
• aria-grabbed (en-US)
• aria-haspopup (en-US)
• aria-hidden
• aria-invalid (en-US)
• aria-keyshortcuts (en-US)
• aria-label
• aria-labelledby
• aria-live (en-US)
• aria-owns (en-US)
• aria-relevant (en-US)
• aria-roledescription (en-US)

除了 aria-label 和 aria-labelledby 这两个被“特别禁止”的属性，其他属性是全局适用的。这两个被“特别禁止”的属性无法在具有 presentation (en-US) 角色或与其同义的 none (en-US) 角色的元素上使用。

以下是 MDN 上介绍的 WAI-ARIA 状态和属性。

Using the aria-labelledby attribute

aria-labelledby属性用来表明某些元素的 id 是某一对象的标签。它被用来确定控件或控件组与它们标签之间的联系。使用诸如屏幕阅读器等辅助技术的用户通常使用 tabbing 在页面的不同区域间进行导航。如果一个输入元素、控件或控件组没有被分配一个 label 标签，那么屏幕阅读器就无法对其进行阅读。

使用 aria-hidden 属性

本文用来说明如何使用 aria-hidden 属性。aria-hidden 属性可以用来控制一系列可访问 API 中的非交互内容的显示或隐藏。

使用 aria-label 属性

aria-label 属性用来给当前元素加上的标签描述，接受字符串作为参数。是用不可视的方式给元素加 label（如果被描述元素存在真实的描述元素，可使用 aria-labelledby 属性作为来绑定描述元素和被描述元素来代替）。

• 使用 ARIA：角色、状态和属性