So finden und erhalten Sie HTML -Elemente in JavaScript
In diesem Bericht werden die Verfahren zum Auffinden und Erhalten von HTML-Elementen in JavaScript erörtert. Darüber hinaus werden in diesem Artikel. So lass uns anfangen!
So finden und erhalten Sie HTML -Elemente per ID in JavaScript
Die meisten Javascript -Entwickler nutzten die GetElementById () Methode zum Auffinden und Erhalten von HTML -Elementen mit eindeutigen IDs. Wenn Sie eine ID bestanden haben, die keinem HTML -Element gehört, zeigt die Methode getElementById () den Nullwert an.
Syntax der GetElementById () -Methode
dokumentieren.GetElementById (elementId)Hier das "elementid„Repräsentiert die eindeutige ID des HTML.
Beispiel: Finden und holen Sie HTML -Elemente nach ID in JavaScript
Wir werden HTML -Elemente wie eine Überschrift mit dem hinzufügen
Tag und drei Absatzelemente mit dem
Tag im folgenden Beispiel. Beachten Sie, dass wir auch hinzugefügt haben “IDS”Mit den Absatzelementen:
Dies ist LinuxHint.com
Finden und erhalten Sie HTML -Elemente per ID in JavaScript
Dies ist ein JavaScript -Programm, das die Methode "getElements byid" verwendet
Im nächsten Schritt werden wir das Element mit der ID finden und bekommen “P1"Durch die Verwendung der"dokumentieren.GetElementById ()" Methode. Nach dem Ding werden wir den Inhalt des abgerufenen HTML -Elements ändern:
Führen Sie das oben gegebene Programm in Ihrem bevorzugten Code-Editor oder einer Online-Codierungssandbox aus. Wir werden das JSBin jedoch für diesen Zweck verwenden:
Die Ausführung des oben gegebenen JavaScript-Programms zeigt die folgende Ausgabe an:
So finden und erhalten Sie HTML -Elemente von Tagname in JavaScript
Sie können das nutzen “GetElementsByTagName ()”JavaScript -Methode zum Auffinden und Erhalten eines spezifischen HTML -Elements mit dem Tag -Namen.
Syntax der GetElementsByTagName () -Methode
dokumentieren.GetElementsByTagName (Tagname)Hier repräsentiert der TagName den Tag -Namen des HTML -Elements, das Sie abrufen möchten.
Beispiel: Finden und holen Sie HTML -Elemente nach Tagname in JavaScript
Das folgende Beispiel wird alle HTML-Elemente mit dem Tag-Namen gefunden und erhaltenPVerwenden der GetElementsByTagName () -Methode. Danach wird der Inhalt des HTML -Vorhandenseins im ersten Index der Objektsammlung angezeigt:
Dies ist LinuxHint.com
Finden und holen Sie sich HTML -Elemente mit dem Tag -Namen in JavaScript
Dies ist ein JavaScript -Programm, das die Methode "GetElementsByTagName" verwendet
Wie Sie sehen können, wird der Text des ersten Absatzes unseres JavaScript -Programms erfolgreich angezeigt:
So finden und erhalten Sie HTML -Elemente nach Klassenname in JavaScript
Der "GetElements byclassName ()Die Methode wird zum Auffinden und Erhalten von HTML -Elementen mit derselben Klasse verwendet. Durch die Verwendung des Klassennamens wird der JavaScript -Interpreter, wenn Sie versuchen, ein HTML -Element zu erhalten. Danach können Sie bestimmte Operationen für diese HTML -Elemente ausführen.
Syntax von GetElementsByClassName () -Methoden
dokumentieren.GetElements ByClassName (Klassenname)Hier das "Klassenname”Repräsentiert den Klassennamen der HTML -Elemente, die Sie benötigen, um Ihr Programm zu finden und zu bekommen.
Beispiel: Finden und holen Sie HTML -Elemente nach Klassenname in JavaScript
Im folgenden Beispiel haben wir eine Überschrift und einige Absatzelemente mit dem Klassennamen hinzugefügtC1”:
Dies ist LinuxHint.com
Finden und erhalten Sie HTML -Elemente nach Klassennamen in JavaScript
Text im ersten Absatz
Text im zweiten Absatz
Als nächstes werden wir nach den HTML -Elementen suchen, die haben "C1”Als Klasse verwenden Sie die Methode GetElementsByClassName () und speichern die Sammlungen der Objekte in“A”:
Hier ist die Ausgabe, die wir durch die Ausführung des oben gegebenen JavaScript-Programms erhalten haben:
So finden und erhalten Sie HTML -Elemente von CSS Selector in JavaScript
In HTML die QuerySelectorAll () Die Methode gibt ein statisches Nodelist -Objekt zurück, das eine Sammlung der untergeordneten Elemente eines Elements umfasst, das mit den angegebenen CSS -Selektoren übereinstimmt. Indexnummern werden verwendet, um die Knoten ab 0 zu finden und zu erhalten.
Syntax der QuerySelectorAll () -Methode
Element.QuerySelectorall (Selektoren)Die QuerySelectorAll () -Methode nimmt an “SelektorenAls Argument umfasst eine DOM -Zeichenfolge einen oder mehrere gültige CSS -Selektoren.
Beispiel: Finden und holen Sie HTML -Elemente von CSS Selector in JavaScript
Im untergezogenen JavaScript-Programm haben wir die Methode querySelectorAll () verwendet, um die Absatz-HTML-Elemente mit "zu erhalten" mit "Erzielung des Absatzes" mit "Ermittlung"C1”Als Klassenname:
Dies ist LinuxHint.com
Finden und erhalten Sie HTML -Elemente nach Klassennamen in JavaScript
Text im ersten Absatz
Text im zweiten Absatz
Schauen Sie sich die Ausgabe der JavaScript -QuerySelectorAll () -Methode an:
Abschluss
getElementById (), GetElementsByTagName (), GetelementsByClassName () und QuerySelectorAll () sind die häufigsten JavaScript -Methoden, mit denen Elemente in einem JavaScript -Programm gefunden und abgerufen werden. Sie können eine der genannten Methoden verwenden, um nach einem bestimmten HTML -Element im Code zu suchen. In dieser Beschreibung wurde die Verfahren zum Auffinden und Erhalten von HTML-Elementen in JavaScript erörtert. Darüber hinaus werden in diesem Artikel auch die Beispiele zu GetelementById (), GetelementsByTagName (), GetElementsByCassName () und QuerySelectorAll () -Methoden nachgewiesen.