ElementInternals
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.
Das ElementInternals
Interface des Document Object Model gibt Web-Entwicklern die Möglichkeit, benutzerdefinierte Elemente vollständig in HTML-Formulare zu integrieren. Es bietet Hilfsfunktionen, um mit diesen Elementen auf dieselbe Weise zu arbeiten, wie Sie mit jedem Standard-HTML-Formularelement arbeiten würden, und stellt auch das Accessibility Object Model für das Element bereit.
Konstruktor
Dieses Interface hat keinen Konstruktor. Ein ElementInternals
-Objekt wird zurückgegeben, wenn HTMLElement.attachInternals()
aufgerufen wird.
Instanzeigenschaften
ElementInternals.shadowRoot
Schreibgeschützt-
Gibt das
ShadowRoot
-Objekt zurück, das mit diesem Element verknüpft ist. ElementInternals.form
Schreibgeschützt-
Gibt das
HTMLFormElement
zurück, das mit diesem Element verknüpft ist. ElementInternals.states
Schreibgeschützt-
Gibt das
CustomStateSet
zurück, das mit diesem Element verknüpft ist. ElementInternals.willValidate
Schreibgeschützt-
Ein boolescher Wert, der
true
zurückgibt, wenn das Element ein sendbares Element ist, das ein Kandidat für die Einschränkungsvalidierung ist. ElementInternals.validity
Schreibgeschützt-
Gibt ein
ValidityState
-Objekt zurück, das die verschiedenen Gültigkeitszustände des Elements in Bezug auf die Einschränkungsvalidierung darstellt. ElementInternals.validationMessage
Schreibgeschützt-
Ein String, der die Validierungsnachricht dieses Elements enthält.
ElementInternals.labels
Schreibgeschützt-
Gibt eine
NodeList
von allen Label-Elementen zurück, die mit diesem Element verbunden sind.
Instanzeigenschaften, die von ARIA enthalten sind
Das ElementInternals
Interface enthält auch die folgenden Eigenschaften.
Hinweis: Diese sind enthalten, um sicherzustellen, dass Standard-Accessibility-Semantiken auf einem benutzerdefinierten Element definiert werden können. Diese können durch autorendefinierte Attribute überschrieben werden, stellen jedoch sicher, dass die Standardsemantiken erhalten bleiben, falls der Autor diese Attribute löscht oder gar nicht hinzufügt. Weitere Informationen finden Sie im Accessibility Object Model Explainer.
ElementInternals.ariaAtomic
-
Ein String, der das Attribut
aria-atomic
widerspiegelt, welches angibt, ob Hilfstechnologien den gesamten oder nur Teile des geänderten Bereichs basierend auf den durch das Attributaria-relevant
definierten Änderungsbenachrichtigungen präsentieren. ElementInternals.ariaAutoComplete
-
Ein String, der das Attribut
aria-autocomplete
widerspiegelt, welches angibt, ob das Eingeben von Text die Anzeige einer oder mehrerer Vorhersagen des beabsichtigten Werts des Benutzers für eine Kombinationsbox, Suchbox oder Textbox auslösen könnte, und wie diese präsentiert würden, wenn sie gemacht werden. ElementInternals.ariaBusy
-
Ein String, der das Attribut
aria-busy
widerspiegelt, welches angibt, ob ein Element modifiziert wird, da Hilfstechnologien möglicherweise warten möchten, bis die Änderungen abgeschlossen sind, bevor sie dem Benutzer sichtbar gemacht werden. ElementInternals.ariaChecked
-
Ein String, der das Attribut
aria-checked
widerspiegelt, welches den aktuellen "überprüft"-Zustand von Kontrollkästchen, Optionsschaltflächen und anderen Widgets angibt, die einen geprüften Zustand haben. ElementInternals.ariaColCount
-
Ein String, der das Attribut
aria-colcount
widerspiegelt, welches die Anzahl der Spalten in einer Tabelle, einem Raster oder Baumraster definiert. ElementInternals.ariaColIndex
-
Ein String, der das Attribut
aria-colindex
widerspiegelt, welches den Spaltenindex oder die Position eines Elements in Bezug auf die Gesamtanzahl der Spalten innerhalb einer Tabelle, eines Rasters oder Baumrasters definiert. ElementInternals.ariaColIndexText
-
Ein String, der das Attribut
aria-colindextext
widerspiegelt, welches eine menschenlesbare Textalternative von aria-colindex definiert. ElementInternals.ariaColSpan
-
Ein String, der das Attribut
aria-colspan
widerspiegelt, welches die Anzahl der Spalten definiert, die von einer Zelle oder einem Raster im Inneren einer Tabelle, eines Rasters oder Baumrasters über spannt werden. ElementInternals.ariaCurrent
-
Ein String, der das Attribut
aria-current
widerspiegelt, welches das Element angibt, das das aktuelle Element innerhalb eines Containers oder einer Gruppe verwandter Elemente darstellt. ElementInternals.ariaDescription
-
Ein String, der das Attribut
aria-description
widerspiegelt, welches einen String-Wert definiert, der die aktuellen ElementInternals beschreibt oder annotiert. ElementInternals.ariaDisabled
-
Ein String, der das Attribut
aria-disabled
widerspiegelt, welches angibt, dass das Element wahrnehmbar, aber deaktiviert ist, sodass es nicht bearbeitet oder anderweitig operiert werden kann. ElementInternals.ariaExpanded
-
Ein String, der das Attribut
aria-expanded
widerspiegelt, welches angibt, ob ein von diesem Element gesteuertes oder besessenes Gruppenelement erweitert oder eingeklappt ist. ElementInternals.ariaHasPopup
-
Ein String, der das Attribut
aria-haspopup
widerspiegelt, welches die Verfügbarkeit und den Typ eines interaktiven Popup-Elements, wie z.B. Menü oder Dialog, angibt, das von einem ElementInternals ausgelöst werden kann. -
Ein String, der das Attribut
aria-hidden
widerspiegelt, welches angibt, ob das Element in einer Accessibility-API sichtbar ist. ElementInternals.ariaKeyShortcuts
-
Ein String, der das Attribut
aria-keyshortcuts
widerspiegelt, welches Tastaturkürzel angibt, die ein Autor implementiert hat, um ein ElementInternals zu aktivieren oder den Fokus darauf zu legen. ElementInternals.ariaLabel
-
Ein String, der das Attribut
aria-label
widerspiegelt, welches einen String-Wert definiert, der die aktuellen ElementInternals beschriftet. ElementInternals.ariaLevel
-
Ein String, der das Attribut
aria-level
widerspiegelt, welches die hierarchische Ebene eines Elements innerhalb einer Struktur definiert. ElementInternals.ariaLive
-
Ein String, der das Attribut
aria-live
widerspiegelt, welches angibt, dass ein Element aktualisiert wird, und die Arten von Updates beschreibt, die Benutzeragenten, Hilfstechnologien und Benutzer vom Live-Bereich erwarten können. ElementInternals.ariaModal
-
Ein String, der das Attribut
aria-modal
widerspiegelt, welches angibt, ob ein Element modales Verhalten zeigt, wenn es angezeigt wird. ElementInternals.ariaMultiline
-
Ein String, der das Attribut
aria-multiline
widerspiegelt, welches angibt, ob ein Textfeld mehrere Zeilen von Eingaben akzeptiert oder nur eine einzelne Zeile. ElementInternals.ariaMultiSelectable
-
Ein String, der das Attribut
aria-multiselectable
widerspiegelt, welches angibt, dass der Benutzer mehr als einen Artikel aus den aktuellen auswählbaren Nachfahren auswählen kann. ElementInternals.ariaOrientation
-
Ein String, der das Attribut
aria-orientation
widerspiegelt, welches angibt, ob die Ausrichtung des Elements horizontal, vertikal oder unbekannt/mehrdeutig ist. ElementInternals.ariaPlaceholder
-
Ein String, der das Attribut
aria-placeholder
widerspiegelt, welches einen kurzen Hinweis definiert, der dem Benutzer bei der Dateneingabe helfen soll, wenn das Steuerungselement keinen Wert hat. ElementInternals.ariaPosInSet
-
Ein String, der das Attribut
aria-posinset
widerspiegelt, welches die Nummer oder Position eines Elements im aktuellen Satz von Listenelementen oder Baumknoten definiert. ElementInternals.ariaPressed
-
Ein String, der das Attribut
aria-pressed
widerspiegelt, welches den aktuellen "gedrückt"-Zustand von Umschalt-Tasten angibt. ElementInternals.ariaReadOnly
-
Ein String, der das Attribut
aria-readonly
widerspiegelt, welches angibt, dass das Element nicht bearbeitbar, aber dennoch operierbar ist. ElementInternals.ariaRelevant
Nicht standardisiert-
Ein String, der das Attribut
aria-relevant
widerspiegelt, welches angibt, welche Benachrichtigungen der Benutzeragent auslösen wird, wenn der Accessibility-Baum innerhalb eines Live-Bereichs geändert wird. Dies wird verwendet, um zu beschreiben, welche Änderungen in einemaria-live
Bereich relevant sind und angekündigt werden sollten. ElementInternals.ariaRequired
-
Ein String, der das Attribut
aria-required
widerspiegelt, welches angibt, dass Benutzereingaben im Element erforderlich sind, bevor ein Formular eingereicht werden kann. ElementInternals.role
-
Ein String, der eine ARIA-Rolle enthält. Eine vollständige Liste der ARIA-Rollen finden Sie auf der ARIA-Techniken Seite.
ElementInternals.ariaRoleDescription
-
Ein String, der das Attribut
aria-roledescription
widerspiegelt, welches eine menschenlesbare, autorlokalisierte Beschreibung für die Rolle eines Elements definiert. ElementInternals.ariaRowCount
-
Ein String, der das Attribut
aria-rowcount
widerspiegelt, welches die Gesamtanzahl der Zeilen in einer Tabelle, einem Raster oder Baumraster definiert. ElementInternals.ariaRowIndex
-
Ein String, der das Attribut
aria-rowindex
widerspiegelt, welches den Zeilenindex oder die Position eines Elements in Bezug auf die Gesamtanzahl der Zeilen innerhalb einer Tabelle, eines Rasters oder Baumrasters definiert. ElementInternals.ariaRowIndexText
-
Ein String, der das Attribut
aria-rowindextext
widerspiegelt, welches eine menschenlesbare Textalternative von aria-rowindex definiert. ElementInternals.ariaRowSpan
-
Ein String, der das Attribut
aria-rowspan
widerspiegelt, welches die Anzahl der Zeilen definiert, die von einer Zelle oder einem Raster innerhalb einer Tabelle, eines Rasters oder Baumrasters über spannt werden. ElementInternals.ariaSelected
-
Ein String, der das Attribut
aria-selected
widerspiegelt, welches den aktuellen "ausgewählt"-Zustand von Elementen angibt, die einen ausgewählten Zustand haben. ElementInternals.ariaSetSize
-
Ein String, der das Attribut
aria-setsize
widerspiegelt, welches die Anzahl der Elemente im aktuellen Satz von Listenelementen oder Baumknoten definiert. ElementInternals.ariaSort
-
Ein String, der das Attribut
aria-sort
widerspiegelt, welches angibt, ob Elemente in einer Tabelle oder einem Raster in aufsteigender oder absteigender Reihenfolge sortiert sind. ElementInternals.ariaValueMax
-
Ein String, der das Attribut
aria-valuemax
widerspiegelt, welches den maximal erlaubten Wert für ein Bereichs-Widget definiert. ElementInternals.ariaValueMin
-
Ein String, der das Attribut
aria-valuemin
widerspiegelt, welches den minimal erlaubten Wert für ein Bereichs-Widget definiert. ElementInternals.ariaValueNow
-
Ein String, der das Attribut
aria-valuenow
widerspiegelt, welches den aktuellen Wert für ein Bereichs-Widget definiert. ElementInternals.ariaValueText
-
Ein String, der das Attribut
aria-valuetext
widerspiegelt, welches die menschenlesbare Textalternative von aria-valuenow für ein Bereichs-Widget definiert.
Instanzmethoden
ElementInternals.setFormValue()
-
Setzt den Übermittlungswert und den Zustand des Elements und kommuniziert diese an den Benutzeragenten.
ElementInternals.setValidity()
-
Legt die Gültigkeit des Elements fest.
ElementInternals.checkValidity()
-
Überprüft, ob ein Element die auf es angewendeten Einschränkungsvalidierungs-Regeln erfüllt.
ElementInternals.reportValidity()
-
Überprüft, ob ein Element die auf es angewendeten Einschränkungsvalidierungs-Regeln erfüllt und sendet zudem eine Validierungsnachricht an den Benutzeragenten.
Beispiele
Das folgende Beispiel demonstriert, wie man ein benutzerdefiniertes formularassoziiertes Element mit HTMLElement.attachInternals
erstellt.
class CustomCheckbox extends HTMLElement {
static formAssociated = true;
constructor() {
super();
this.internals_ = this.attachInternals();
}
// …
}
window.customElements.define("custom-checkbox", CustomCheckbox);
let element = document.createElement("custom-checkbox");
let form = document.createElement("form");
// Append element to form to associate it
form.appendChild(element);
console.log(element.internals_.form);
// expected output: <form><custom-checkbox></custom-checkbox></form>
Spezifikationen
Specification |
---|
HTML Standard # the-elementinternals-interface |
Browser-Kompatibilität
BCD tables only load in the browser