accessibility - 我可以使用 aria-描述的引用多个元素吗？

Question

如果我有两个元素一起描述一个元素，我可以在 aria-describedby 上使用两个 id 吗？这样的属性？

<div id="description-1"></div>
<div id="description-2"></div>
<div aria-describedby="description-1 description-2"></div>

Answer 1

是的。 aria-describedby (和 aria-labelledby)属性需要 ID reference list因为它的值(value)。可以提供多个 ID，以空格分隔。当您以这种方式关联多个元素时，它们将连接成一个描述字符串。
需要注意的几点:

标点。如果将 2 个引用的元素用作单独的句子，则包含句号(句号)会有所帮助，以便屏幕阅读器可以更自然地朗读。或者，您可以使用多个引用来构建一个句子。这取决于你的场景。

aria-describedby并非对所有元素都有效。在您的示例中，该属性位于 div 上元素，这通常不起作用。当用于交互元素和地标区域时，它效果更好。见 Short note on aria-label, aria-labelledby, and aria-describedby为指导。

引用的元素将构成可访问描述的一部分，无论它们是否可见。如果以这种方式关联错误消息，请小心。见 Hidden or visible – makes no difference在这里获得指导。

有关更多详细信息，请参阅 Accessible Name and Description Computation HTML Accessibility API Mappings 1.0 中的规则。