jQuery - Inhalte und Attribute abrufen
jQuery enthält leistungsstarke Methoden zum Ändern und Manipulieren von HTML-Elementen und -Attributen.
jQuery-DOM-Manipulation
Ein sehr wichtiger Bestandteil von jQuery ist die Möglichkeit, das DOM zu manipulieren.
jQuery enthält eine Reihe von DOM-bezogenen Methoden, die den Zugriff auf und die Bearbeitung von Elementen und Attributen vereinfachen.
DOM = Document Object Model
Das DOM definiert einen Standard für den Zugriff auf HTML- und XML-Dokumente:
„Das W3C Document Object Model (DOM) ist eine plattform- und sprachneutrale Schnittstelle, mit der Programme und Skripte dynamisch auf Inhalt, Struktur und Inhalt zugreifen und diese aktualisieren können Stil eines Dokuments."
Inhalt abrufen - text(), html() und val()
Drei einfache, aber nützliche jQuery-Methoden für die DOM-Manipulation sind:
text()- Legt den Textinhalt ausgewählter Elemente fest oder gibt ihn zurückhtml()- Setzt oder gibt den Inhalt ausgewählter Elemente zurück (einschließlich HTML-Markup)val()- Legt den Wert von Formularfeldern fest oder gibt ihn zurück
Das folgende Beispiel zeigt, wie Inhalte mit jQuery text()und html()Methoden abgerufen werden:
Beispiel
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
Das folgende Beispiel zeigt, wie Sie den Wert eines Eingabefelds mit der jQuery- val()Methode abrufen:
Beispiel
$("#btn1").click(function(){
alert("Value: " + $("#test").val());
});
Attribute abrufen - attr()
Die jQuery- attr()Methode wird verwendet, um Attributwerte abzurufen.
Das folgende Beispiel zeigt, wie Sie den Wert des href-Attributs in einem Link erhalten:
Beispiel
$("button").click(function(){
alert($("#w3s").attr("href"));
});
Im nächsten Kapitel wird erläutert, wie Sie Inhalts- und Attributwerte festlegen (ändern).
jQuery-Übungen
jQuery-HTML-Referenz
Eine vollständige Übersicht aller jQuery-HTML-Methoden finden Sie in unserer jQuery-HTML/CSS-Referenz .