Elementwert mit JavaScript erhalten

Manchmal möchten Programmierer den Wert eines beliebigen Elements ändern, daher müssen sie zuerst das Element erhalten und dann den Wert des angegebenen Elements überprüfen. Danach wenden Sie die Operationen auf sie an. Um die Referenz des Elements und seinen Wert zu erhalten, bietet JavaScript einige vordefinierte Methoden oder Eigenschaften.

In diesem Tutorial wird erklärt, wie Sie den Wert eines Elements mit JavaScript erhalten können.

So erhalten Sie den Elementwert mit JavaScript?

Verwenden Sie das „Wert eines HTML -Elements, um den Wert eines HTML -Elements zu erhalten“WertEigenschaft der Htmldataelement -Schnittstelle.

Um die Referenz des Elements zu erhalten, werden mehrere Methoden verwendet

• GetElementById () -Methode
• GetElementByClass () -Methode
• GetElementByTagName () -Methode
• QuerySelector () -Methode
• QuerySelectorAll () -Methode

Hier die am häufigsten verwendeten Methoden mit dem “WertEigentum wird besprochen.

BEISPIEL 1: Elementwert mithilfe der Werteigenschaft mit GetElementById () -Methode erhalten

Verwenden Sie die “, um den Wert des Elements zu erhalten.“WertEigentum mit dem "GetElementById ()"Methode zum Erhalten der Referenz des Elements mit seinem zugewiesenen"Ausweis”.

Erstellen Sie zunächst ein Formular in der HTML -Datei mit einem Eingabefeld und einer Schaltfläche, die den eingegebenen Wert im Textfeld auf der “angezeigt wirdklicken" Fall:

Wert des Eingabefeldes erhalten

Folgen Sie den folgenden Codezeilen:

Funktion getElementValue ()
var value = document.GetElementById ("Text").Wert;
Alarm (Wert);

Im obigen Code -Snippet:

• Definieren Sie zuerst eine Funktion “GetElementValue ()”.
• Dann holen Sie das Element mit seiner ID “Text"Und holen Sie seinen Wert unter Verwendung des"Wert"Eigenschaft und speichern Sie es in einer Variablen"Wert”.
• Zeigen Sie schließlich den Wert des Elements in einer Warnmeldung an.

Ausgang

Die obige Ausgabe zeigt an, dass der Wert des Elements mit der Value -Eigenschaft mit der Methode getElementById () erfolgreich abgerufen wird.

So erhalten Sie die Referenz des Elements ohne angegebene ID? Folgen Sie dem folgenden Abschnitt.

Beispiel 2: Elementwert mithilfe der Value -Eigenschaft mit querySelector () -Methode abrufen

Eine andere Möglichkeit, einen Verweis auf ein Element zu erhalten, um seinen Wert zu erhalten, besteht darin, die zu verwendenQuerySelector ()" Methode. Es braucht eine "Wähler”Des Namens eines Elements als Argument und gibt das erste Element des Dokuments, das dem angegebenen Selektor entspricht.

Erstellen Sie hier zunächst ein Dropdown-Menü mit dem Tag und eine Schaltfläche, die das auslöst “GetElementValue ()Funktion zum Erhalten des Wertes der ausgewählten Option:

Wählen Sie die Sprache, die Sie lernen möchten:

Html
CSS
JavaScript
Java
Python



Wert des Eingabefeldes erhalten

Verwenden Sie in der JavaScript -Datei den folgenden Code:

Funktion getElementValue ()
var value = document.QuerySelector ("Select").Wert;
Alarm (Wert);

In den obigen Codezeilen:

• Eine Funktion definieren “GetElementValue ()”.
• Dann rufen Sie das an "QuerySelector ()"Methode durch Übergabe eines Selektors"wählen”Element mit dem“WertEigenschaft, die den ausgewählten Wert des Dropdown-Menüs erhält.
• Zuletzt zeigen Sie den ausgewählten Wert des Elements in einer Warnmeldung.

Die Ausgabe zeigt die ausgewählten Werte in einer Warnmeldung an:

Abschluss

Verwenden Sie die “, um den Wert des DOM -Elements zu erhaltenWert”Eigenschaft der Htmldataelement -Schnittstelle mit verschiedenen Methoden, um die Referenz auf das Element zu erhalten, wie zGetElementById ()" Methode, "GetElementByClass ()Methode oder die “QuerySelector ()" Methode. In diesem Tutorial wurde das Verfahren zum Erhalten des Elementwerts mit JavaScript erläutert.