ElementInternals:states 属性

Baseline 2024
新推出

自 2024 年 5 月以来,此功能已在最新设备和浏览器版本中可用。此功能可能不适用于较旧的设备或浏览器。

ElementInternals 接口的只读属性 states 返回一个 CustomStateSet,该对象表示自定义元素的可能状态。

一个 CustomStateSet,它是一个字符串的 Set

示例

以下函数向 CustomStateSet 添加和移除状态 --checked,然后根据自定义复选框是否被选中或取消选中,在控制台打印 truefalse

js
class MyElement extends HTMLElement {
  set checked(flag) {
    if (flag) {
      this._internals.states.add("--checked");
    } else {
      this._internals.states.delete("--checked");
    }

    console.log(this._internals.states.has("--checked"));
  }
}

规范

规范
HTML
# custom-state-pseudo-class

浏览器兼容性