為屬性添加描述（用於屏幕閱讀器），而無需添加新標簽/元素

Question

我有一個元素： <div id="container-div" role="region"></div>

當用戶單擊鍵“ R”時，我希望屏幕閱讀器讀取以下單詞：

“這是XXX地區區域”

無需在DOM中添加新標簽或元素。

（保持DOM干凈而沒有額外的隱藏標簽非常重要）

Answer 1

只需添加一個aria-label屬性，如下所示：

<div id="container-div" role="region" aria-label="This is an XXX">

提示：請勿在描述中使用“區域”一詞，因為屏幕閱讀器（至少是JAWS）會自行添加。 因此，如果您寫“這是XXX區域區域”，則屏幕閱讀器會由於該角色而顯示“這是XXX區域區域”。