元素:ariaRelevant 属性

Baseline 2023
新推出

自 ⁨2023 年 10 月⁩ 以来,此功能已在最新设备和浏览器版本中得到支持。此功能可能无法在旧设备或浏览器上运行。

非标准:此特性未标准化。我们不建议在生产环境中使用非标准特性,因为它们浏览器支持有限,并且可能会更改或被移除。但是,在没有标准选项的特定情况下,它们可以是合适的替代方案。

Element 接口的 ariaRelevant 属性反映了 aria-relevant 属性的值,该属性指示当 live region 内的可访问性树被修改时,用户代理将触发哪些通知。这用于描述 aria-live region 中哪些更改是相关的,应该被播报。

一个字符串,包含以下一个或多个值,以空格分隔

"additions"

live region 内的元素节点的添加应被视为相关。

"removals"

从 live region 中删除节点应被视为相关。

"text"

现有节点文本内容的更改应被视为相关。

"all"

等同于 "additions removals text"

示例

在此示例中,ID 为 text 的元素的 aria-relevant 属性设置为 "all"。使用 ariaRelevant,我们将该值更新为 "text"。

html
<div
  id="clock"
  role="timer"
  aria-live="polite"
  aria-atomic="true"
  aria-relevant="all"></div>
js
let el = document.getElementById("clock");
console.log(el.ariaRelevant); // all
el.ariaRelevant = "text";
console.log(el.ariaRelevant); // text

浏览器兼容性