ARIA：aria-describedby 属性

描述

aria-describedby 属性列出了描述该对象的元素的 id。它用于在控件或控件组与其描述文本之间建立关联。

aria-describedby 属性不限于表单控件。它还可以用于将静态文本与控件、元素组、带有标题的区域、定义等关联起来。aria-describedby 属性可用于语义化 HTML 元素以及具有 ARIA role 的元素。

aria-describedby 属性与 aria-labelledby 属性非常相似。虽然 aria-labelledby 列出了描述对象本质的标签或元素的 id，但 aria-describedby 列出了提供用户可能需要的更多信息的描述或元素的 id。aria-labelledby 和 aria-describedby 都引用其他元素来计算文本替代，但标签应该是简洁的，而描述旨在提供更详细的信息；标签描述对象的本质，而描述提供用户可能需要的更多信息。

通过 aria-describedby 链接的元素不需要可见。即使元素隐藏，也可以引用它。例如，表单控件可以有一个默认隐藏的描述，通过“更多信息”图标等披露控件在请求时显示。视力用户点击图标查看描述，而辅助技术用户可以立即访问它，因为描述已通过 aria-describedby 从该表单控件引用。

当关联内容包含纯文本时，aria-describedby 属性是合适的。如果内容很长、包含有用的语义或具有需要用户导航的复杂结构，请改用 aria-details。aria-details 允许辅助技术用户访问关联的结构化内容，并提供额外的导航命令，从而更容易理解结构或以小片段的形式体验信息。

注意： aria-describedby 内容应仅为文本字符串。如果内容中存在重要的底层语义，请考虑使用 aria-details。

示例

html

<button aria-describedby="trash-desc">Move to trash</button>
…
<p id="trash-desc">
  Items in the trash will be permanently removed after 30 days.
</p>

注意： aria-describedby 属性并非设计用于引用外部资源的描述。由于其值是一个或多个 id（如果多个则以空格分隔），因此它必须引用同一 DOM 文档中的元素。