ARIA: suggestion 角色
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 的一部分,該版本仍在起草中。