HTMLElement: attachInternals()-Methode

Baseline 2023

Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die HTMLElement.attachInternals()-Methode gibt ein ElementInternals-Objekt zurück. Diese Methode ermöglicht es einem benutzerdefinierten Element, an HTML-Formularen teilzunehmen. Das ElementInternals-Interface bietet Hilfsmittel zum Arbeiten mit diesen Elementen in der gleichen Weise, wie Sie mit einem Standard-HTML-Formularelement arbeiten würden, und stellt auch das Accessibility Object Model dem Element zur Verfügung.

Syntax

js
attachInternals()

Parameter

Keine.

Rückgabewert

Ein ElementInternals-Objekt.

Ausnahmen

NotSupportedError DOMException

Ausgelöst, wenn das Element kein benutzerdefiniertes Element ist.

NotSupportedError DOMException

Ausgelöst, wenn die "internals"-Funktion als Teil der Elementdefinition deaktiviert wurde.

NotSupportedError DOMException

Ausgelöst, wenn diese Methode zweimal auf demselben Element aufgerufen wird.

Beispiele

Das folgende Beispiel demonstriert, wie man ein benutzerdefiniertes, formularassoziiertes Element mit HTMLElement.attachInternals erstellt. Die ElementInternals.form-Eigenschaft wird dann in die Konsole ausgegeben, um zu zeigen, dass wir ein ElementInternals-Objekt haben.

js
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_.form);

Spezifikationen

Specification
HTML Standard
# dom-attachinternals

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch