HTMLFormElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Das HTMLFormElement Interface repräsentiert ein

Element im DOM. Es ermöglicht den Zugriff auf – und in manchen Fällen die Modifikation von – Aspekten des Formulars sowie den Zugriff auf seine Komponenten.

EventTarget Node Element HTMLElement HTMLFormElement

Instanz-Eigenschaften

Dieses Interface erbt auch Eigenschaften von seinem Elternteil, HTMLElement.

HTMLFormElement.acceptCharset

Ein String, der den Wert des accept-charset HTML-Attributs des Formulars widerspiegelt.

HTMLFormElement.action

Ein String, der den Wert des action HTML-Attributs des Formulars widerspiegelt und die URI eines Programms enthält, das die vom Formular übermittelten Informationen verarbeitet.

HTMLFormElement.autocomplete

Ein String, der den Wert des autocomplete HTML-Attributs des Formulars widerspiegelt und angibt, ob die Steuerungen in diesem Formular ihre Werte automatisch vom Browser bevölkert haben können.

HTMLFormElement.encoding oder HTMLFormElement.enctype

Ein String, der den Wert des enctype HTML-Attributs des Formulars widerspiegelt und den Typ des Inhalts angibt, der verwendet wird, um das Formular an den Server zu übertragen. Nur spezifizierte Werte können gesetzt werden. Die beiden Eigenschaften sind Synonyme.

HTMLFormElement.elements Schreibgeschützt

Eine HTMLFormControlsCollection, die alle zu diesem Formularelement gehörenden Formularelemente enthält.

HTMLFormElement.length Schreibgeschützt

Ein long, das die Anzahl der Steuerungen im Formular widerspiegelt.

HTMLFormElement.name

Ein String, der den Wert des name HTML-Attributs des Formulars widerspiegelt und den Namen des Formulars enthält.

HTMLFormElement.noValidate

Ein Boolescher Wert, der den Wert des novalidate HTML-Attributs des Formulars widerspiegelt und angibt, ob das Formular nicht validiert werden soll.

HTMLFormElement.method

Ein String, der den Wert des method HTML-Attributs des Formulars widerspiegelt und die HTTP-Methode angibt, die zur Übermittlung des Formulars verwendet wird. Nur spezifizierte Werte können gesetzt werden.

HTMLFormElement.rel

Ein String, der den Wert des rel HTML-Attributs des Formulars widerspiegelt und angibt, welche Arten von Links das Formular erstellt, als durch Leerzeichen getrennte Liste von aufgezählten Werten.

HTMLFormElement.relList Schreibgeschützt

Eine DOMTokenList, die das rel HTML-Attribut als Liste von Tokens widerspiegelt.

HTMLFormElement.target

Ein String, der den Wert des target HTML-Attributs des Formulars widerspiegelt und angibt, wo die Ergebnisse der Formulareinreichung angezeigt werden sollen.

Benannte Eingaben werden als Eigenschaften zu ihrer Eigentümerformularinstanz hinzugefügt und können native Eigenschaften überschreiben, wenn sie denselben Namen haben (z. B. ein Formular mit einer Eingabe namens action wird die action-Eigenschaft dieser Eingabe anstelle des action HTML-Attributs des Formulars zurückgeben).

Instanz-Methoden

Dieses Interface erbt auch Methoden von seinem Elternteil, HTMLElement.

checkValidity()

Gibt true zurück, wenn die Kindelemente des Formulars einer Einschränkungsvalidierung unterliegen und diese einschränkungen erfüllen; gibt false zurück, wenn einige Steuerungen ihre Einschränkungen nicht erfüllen. Löst ein Ereignis mit dem Namen invalid für jedes Steuerelement aus, das seine Einschränkungen nicht erfüllt; solche Steuerungen gelten als ungültig, wenn das Ereignis nicht abgebrochen wird. Es liegt am Programmierer zu entscheiden, wie auf false reagiert wird.

reportValidity()

Gibt true zurück, wenn die Kindelemente des Formulars ihre Validierungseinschränkungen erfüllen. Wenn false zurückgegeben wird, werden abbrechbare invalid Ereignisse für jedes ungültige Kind ausgelöst und Validierungsprobleme dem Benutzer gemeldet.

requestSubmit()

Fordert an, dass das Formular unter Verwendung des angegebenen Übermittlungsschalters und seiner entsprechenden Konfiguration übermittelt wird.

reset()

Setzt das Formular auf seinen ursprünglichen Zustand zurück.

submit()

Übermittelt das Formular an den Server.

Ereignisse

Diese Ereignisse können mit addEventListener() abgehört werden oder indem ein Ereignislistener der oneventname Eigenschaft dieses Interfaces zugewiesen wird.

formdata

Das formdata-Ereignis wird ausgelöst, nachdem die Eintragsliste, die die Daten des Formulars darstellt, erstellt wurde.

reset

Das reset-Ereignis wird ausgelöst, wenn ein Formular zurückgesetzt wird.

submit

Das submit-Ereignis wird ausgelöst, wenn ein Formular übermittelt wird.

Nutzungshinweise

Ein Objektelement des Formulars abrufen

Um ein HTMLFormElement-Objekt zu erhalten, können Sie einen CSS-Selektor mit querySelector() verwenden, oder Sie können eine Liste aller Formulare im Dokument über die forms Eigenschaft des Dokuments abrufen.

Document.forms gibt ein Array von HTMLFormElement Objekten zurück, das jedes der Formulare auf der Seite auflistet. Sie können dann eine der folgenden Syntaxen verwenden, um ein individuelles Formular zu erhalten:

document.forms[index]

Gibt das Formular am angegebenen index im Array der Formulare zurück.

document.forms[id]

Gibt das Formular zurück, dessen ID id ist.

document.forms[name]

Gibt das Formular zurück, dessen name-Attribut den Wert name hat.

Zugriff auf die Elemente des Formulars

Sie können auf die Liste der datentragenden Elemente des Formulars zugreifen, indem Sie die elements Eigenschaft des Formulars untersuchen. Dies gibt eine HTMLFormControlsCollection zurück, die alle Benutzerdateneintrags-Elemente des Formulars auflistet, sowohl diejenigen, die Nachkommen des sind als auch diejenigen, die durch ihr form-Attribut zum Formular gemacht wurden.

Sie können auch auf das Element des Formulars zugreifen, indem Sie dessen name-Attribut als Schlüssel des form verwenden, aber die Verwendung von elements ist ein besserer Ansatz – es enthält nur die Elemente des Formulars und kann nicht mit anderen Attributen des form vermischt werden.

Probleme beim Benennen von Elementen

Einige Namen werden den JavaScript-Zugriff auf die Eigenschaften und Elemente des Formulars beeinträchtigen.

Zum Beispiel:

  • wird Vorrang vor haben. Das bedeutet, dass form.id sich nicht auf die ID des Formulars beziehen wird, sondern auf das Element, dessen Name "id" ist. Dies wird auch bei anderen Formulareigenschaften der Fall sein, wie oder .
  • wird die elements-Sammlung des Formulars unzugänglich machen. Der Verweis form.elements wird jetzt auf das individuelle Element verweisen.

Um solche Probleme mit Elementnamen zu vermeiden:

  • Immer die elements-Sammlung verwenden, um Mehrdeutigkeiten zwischen einem Elementnamen und einer Formulareigenschaft zu vermeiden.
  • Niemals "elements" als Elementnamen verwenden.

Wenn Sie kein JavaScript verwenden, wird dies kein Problem verursachen.

Elemente, die als Formularelemente betrachtet werden

Die von HTMLFormElement.elements und HTMLFormElement.length eingeschlossenen Elemente sind die folgenden: