ARIA：建议角色

suggestion 角色语义上表示对可编辑文档的单个建议更改。应将其用于包装具有 insertion 角色的元素和具有 deletion 角色的元素的元素。

示例

当您有涉及插入和删除的内容更改时，屏幕阅读器用户无法判断这两个更改是否相关。这是 role="suggestion" 的作用，它应设置在包装这两个更改的元素上，如下所示

html
<p>
  Freida's pet is a
  <span role="suggestion">
    <span role="deletion">black Cat called Luna</span>
    <span role="insertion">purple T. Rex called Tiny</span></span
  >.
</p>

我们甚至可以提供一个信息框，说明谁做出了建议以及何时做出建议，并通过 aria-details 将其与建议相关联

html
<p>
  Freida's pet is a
  <span role="suggestion" aria-details="comment-source">
    <span role="deletion">black Cat called Luna</span>
    <span role="insertion">purple T. Rex called Tiny</span></span
  >.
</p>

<div id="comment-source">
  Suggested by Chris,
  <time datetime="2019-03-30T19:29">March 30 2019, 19:29</time>
</div>

浏览器倾向于为删除提供默认的黑色删除线，并为插入提供黑色的下划线，当使用隐式公开这些角色的 HTML 元素时。但是，当使用显式 ARIA 角色修改 HTML 元素（例如 div）时，您需要使用 CSS 来定制此类删除和插入的视觉样式。

最佳实践

首选 HTML

使用 <ins> 和 <del> 元素将自动传达一个部分具有 insertion 或 deletion 角色。如果可能，请优先使用 HTML 元素。

规范

将成为 WAI-ARIA 1.3 的一部分，该规范仍在起草中。

另请参阅