ElementInternals: validity 属性

Baseline 已广泛支持

此功能已成熟，并可在许多设备和浏览器版本上运行。自 2023 年 3 月以来，它已在各种浏览器中可用。

ElementInternals 接口的只读属性 validity 返回一个 ValidityState 对象，该对象表示元素相对于约束验证的各种有效性状态。

值

一个 ValidityState 对象。

异常

NotSupportedError DOMException: 如果元素没有将其 formAssociated 属性设置为 true，则抛出此异常。

示例

以下示例显示了一个自定义的复选框组件，其中 formAssociated 设置为 true，并将 validity.valid 的值记录到控制台。

class CustomCheckbox extends HTMLElement {
  static formAssociated = true;

  constructor() {
    super();
    this.internals_ = this.attachInternals();
  }

  // …
}

window.customElements.define("custom-checkbox", CustomCheckbox);

let element = document.getElementById("custom-checkbox");
console.log(element.internals_.validity.valid);

规范

规范
HTML # dom-elementinternals-validity

浏览器兼容性

帮助改进 MDN

了解如何贡献

此页面最后修改于 2023年12月8日，由 MDN 贡献者进行。

在 GitHub 上查看此页面 • 报告此内容的问题