Heim >Web-Frontend >js-Tutorial >Wie kann ich mit JavaScript den Wert eines Texteingabefelds ermitteln?
In Szenarien, in denen Formularelemente andere Aspekte einer Webseite stören können, wird der Eingabetext abgerufen Feldwert wird direkt notwendig. JavaScript bietet mehrere Methoden, um dies zu erreichen:
Methode 1: document.getElementById
document.getElementById('searchTxt').value;
Diese Methode ruft den Wert eines Eingabefelds anhand seiner ID ab.
Methode 2: document.getElementsByClassName
document.getElementsByClassName('searchField')[0].value;
Diese Methode wählt alle Eingabefelder mit einer bestimmten Klasse aus und gibt eine HTMLCollection zurück. Verwenden Sie [0], um auf das erste Element zuzugreifen (wenn mehrere Elemente vorhanden sind).
Methode 3: document.getElementsByTagName
document.getElementsByTagName('input')[0].value;
Diese Methode wählt alle Eingabeelemente aus auf einer Seite und gibt eine HTMLCollection zurück. Verwenden Sie erneut [0] für das erste Element.
Methode 4: document.getElementsByName
document.getElementsByName('searchTxt')[0].value;
Diese Methode ruft alle Eingabefelder mit einem bestimmten Namen ab. Verwenden Sie [0] für das erste Vorkommen.
Methode 5: document.querySelector
document.querySelector('#searchTxt').value; document.querySelector('.searchField').value;
Diese Methode verwendet CSS-Selektoren, um Elemente auszuwählen und so einen gezielten Abruf zu ermöglichen.
Methode 6: document.querySelectorAll
document.querySelectorAll('#searchTxt')[0].value; document.querySelectorAll('.searchField')[0].value;
Ähnlich wie document.querySelector verwendet diese Methode CSS-Selektoren, gibt jedoch eine NodeList aller übereinstimmenden Elemente zurück. Verwenden Sie [0] für das erste Element.
Browser-Unterstützung
Die folgende Tabelle zeigt den Grad der Unterstützung für diese Methoden in verschiedenen Browsern:
Browser | Method 1 | Method 2 | Method 3 | Method 4 | Method 5/6 |
---|---|---|---|---|---|
IE6 | Y(Buggy) | N | Y | Y(Buggy) | N |
IE7 | Y(Buggy) | N | Y | Y(Buggy) | N |
IE8 | Y | N | Y | Y(Buggy) | Y |
IE9 | Y | Y | Y | Y(Buggy) | Y |
IE10 | Y | Y | Y | Y | Y |
FF3.0 | Y | Y | Y | Y | N |
FF3.5/FF3.6 | Y | Y | Y | Y | Y |
FF4b1 | Y | Y | Y | Y | Y |
GC4/GC5 | Y | Y | Y | Y | Y |
Safari4/Safari5 | Y | Y | Y | Y | Y |
Opera10.10/ | Y | Y | Y | Y(Buggy) | Y |
Opera10.53/ | Y | Y | Y | Y | Y |
Opera10.60 | Y | Y | Y | Y | Y |
Opera 12 | Y | Y | Y | Y | Y |
Das obige ist der detaillierte Inhalt vonWie kann ich mit JavaScript den Wert eines Texteingabefelds ermitteln?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!