ARIA：aria-details 属性

描述

aria-details 属性可用于为对象提供额外信息或复杂描述。它通过提供更深入的信息来告知辅助技术用户有关内容的信息，无论这些内容是当前文档的一部分还是指向其他资源的链接。

还有其他 HTML 和 WAI-ARIA 属性具有类似目的。HTML <label> 元素以及 aria-label 和 aria-labelledby 属性用于为对象提供简短的标签。HTML title 属性以及 aria-description 和 aria-describedby 属性提供了关于对象的更长的纯文本描述。但是，当对象需要额外信息、复杂描述或可导航内容并且这些内容可用时，应使用 aria-details 属性。

aria-details 属性的作用类似于 HTML 中从未完全支持的 longdesc 属性，该属性指定了一个指向替换元素内容的长描述的 URL，但由于缺乏支持和滥用而被弃用。

aria-details 属性的值是用于获取更详细信息的元素的 id，或者是由空格分隔的 id 列表。当一个元素包含 aria-details 时，辅助技术会告知用户扩展信息的可用性，使用户能够导航到引用的内容。

由 aria-details 引用的元素旨在包含比通常通过 aria-describedby 提供的更多信息。

由 aria-details 引用的元素应向所有用户可见。aria-details 告知用户，否则可能无法快速扫描屏幕的用户，解释性内容是可用的。

注意： aria-details 对可访问描述没有影响。

与 aria-describedby 不同，由 aria-details 引用的元素不用于可访问描述，在呈现给辅助技术用户时也不会被转换为纯文本字符串。如果关联内容不长，并且将引用元素的内容展平为简单的文本字符串不会导致信息丢失，请考虑使用 aria-describedby。也就是说，一个元素可以同时拥有 aria-details 以及使用 aria-describedby 或 aria-description 指定的描述。

示例

对于定义和术语角色，aria-details 将包含在 term 元素上，其值为具有 definition 角色的元素的 id。

html

<p>
  The <strong>cubic-bezier()</strong> functional notation defines a cubic
  <span role="term" aria-details="bezier bezImg">Bézier curve</span>. As these
  curves are continuous, they are often used to smooth down the start and end of
  the curve and are therefore sometimes called easing functions.
</p>

<p role="definition" id="bezier">
  A <strong>Bézier curve</strong>, (Pronounced \ ˈbe-zē-ˌā \)
  <i aria-description="English pronunciation">BEH-zee-ay</i>) is a
  mathematically described curve used in computer graphics and animation. The
  curve is defined by a set of control points with a minimum of two. Web related
  graphics and animations use Cubic Béziers, which are curves with four control
  points P<sub>0</sub>, P<sub>1</sub>, P<sub>2</sub>, and P<sub>3</sub>.
</p>

<a
  href="bezierExplanation.html"
  id="bezImg"
  aria-label="Explanation of Bézier curve in CSS easing functions">
  <img alt="Animated Bézier curve showing 4 control points." src="bezier.gif" />
</a>