ElementInternals: form 屬性

Baseline 已廣泛支援

此功能已成熟，並可在許多裝置和瀏覽器版本上執行。自 2023 年 3 月以來，它已在各種瀏覽器中可用。

ElementInternals 介面的只讀屬性 form 返回與該元素關聯的 HTMLFormElement。

值

一個 HTMLFormElement。

示例

下面的示例顯示了一個名為 myForm 的表單內的自定義複選框元件。將 form.length 列印到控制檯，即可獲得 HTMLFormElement.length 的值。

html

<form id="myForm">
  <custom-checkbox id="custom-checkbox"></custom-checkbox>
  <custom-label for="custom-checkbox">Join newsletter</custom-label>
</form>

class CustomCheckbox extends HTMLElement {
  static formAssociated = true;
  #internals;

  constructor() {
    super();
    this.#internals = this.attachInternals();
  }

  connectedCallback() {
    console.log(this.#internals.form.length);
  }
}

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

規範

規範
HTML # dom-elementinternals-form

瀏覽器相容性

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 2023年12月8日，由 MDN 貢獻者修改。

在 GitHub 上檢視此頁面 • 報告此內容的某個問題