So setzen Sie den Wert eines Eingangsfeldes in JavaScript?

DOM -Manipulationen mit JavaScript ermöglicht es dem Programmierer, die Elemente oder sogar die Attribute der Elemente einer HTML -Webseite zu ändern. Das Ändern des Wertes des Eingangsfeldes ist nicht anders. Es gibt zwei Ansätze, um den Wert eines Eingabefeldes mit JavaScript zu ändern. Diese sind:

• Zuweisen des Wertungsattributs eines Elements, der einen Wert unter Verwendung des Zuordnungsoperators verwendet hat. “=”
• Durch Verwendung der SetAttribute () Funktion.

Lassen Sie uns einfach in die Demonstration dieser beiden Methoden springen, aber davor brauchen wir eine HTML -Vorlage, mit der wir arbeiten können.

Einrichten einer HTML -Webseite

Fügen Sie in der HTML -Datei einfach die folgenden Zeilen hinzu, um ein neues Texteingangsfeld mit der ID "textFeild1" zu erstellen, um ein neues Texteingangsfeld zu erstellen

Wenn wir das Programm ausführen, gehen wir in unserem Browser an die folgende Ausgabe:

Wir können unser Eingangsfeld auf dem Bildschirm sehen.

Methode 1: Weisen Sie das Wertattribut einen Wert direkt zu

Dafür fügen wir zuerst die folgenden Zeilen in unserer HTML -Datei hinzu:

Wert ändern

Dies fügt eine neue Schaltfläche unter unserem Textfeld hinzu. Und wir haben eine Funktion auf die Klicken auf diese Schaltfläche mit dem Namen als als angehängt Wert ändern():

In der Skriptdatei werden die folgenden Funktionen hinzugefügt, damit diese Schaltfläche funktioniert:

Funktion ChangeValue ()
textfield = dokument.getElementById ("textfield1");
Textfeld.value = "Methode 1";

Wir erhalten zunächst einen Verweis auf unser Textfeld mit dem Dokument.GetElementById (). Danach verwenden wir den DOT -Operator, um das Wert -Attribut zu erhalten und ihm direkt einen String -Wert zuzuweisen. Wenn Sie auf diese Schaltfläche klicken, erhalten wir die folgende Ausgabe:

Wie Sie sehen können, konnten wir den Wert des Eingangsfeldes mithilfe des DOT-Operators und des Wertungsattributs ändern.

Methode 2: Verwenden der Funktion setAttribute ()

Zu diesem Zweck fügen wir mit den folgenden Zeilen in der HTML -Datei eine neue Schaltfläche rechts unter der vorherigen Schaltfläche hinzu:

Änderung durch setAttribute ()

Wie Sie sehen können, haben wir diese Taste mit einer Funktion mit dem Namen als als angehoben setAttributechange (). Beim Laden dieses HTML erhalten wir die folgende Webseite auf unserem Browser:

Dann gehen wir in die Skriptdatei und definieren dies setAttributechange () Änderung der Funktion wie folgt:

Funktion setAttributechange ()
textfield = dokument.getElementById ("textfield1");
Textfeld.setAttribute ("Wert", "Methode 2");

In der ersten Zeile erhalten wir einen Verweis auf das Textfeld mit der dokumentieren.GetElementById () Funktion. Danach verwenden wir die Dot-Operator und das setAttribute () Funktion zum Auswählen des Attributs “Wert"Und geben Sie ihm dann einen Stringwert als"Methode 2”. Beim Klicken auf die Schaltfläche erhalten wir die folgende Ausgabe:

Wie Sie sehen können, konnten wir den Wert des Eingangsfelds mithilfe der Funktion setAttribute () ändern.

Abschluss

Mit Hilfe von DOM -Manipulationen können wir mit JavaScript das Wertattribut eines Eingabefeldes innerhalb einer HTML -Webseite einfach ändern. Dafür haben wir zwei verschiedene Ansätze, die uns zum gleichen Ergebnis führen. Wir haben das Element.SetAttribute () -Funktion, mit der wir ein Attribut auswählen und ihm einen Wert unserer Wahl geben können. Zweitens haben wir die Option, das Attribut mit dem "auszuwählen" auszuwählenPunktbetreiberUnd dann diesen Attribut jeden Wert mit dem Zuordnungsoperator zuweisen "=.”