Wiederholung: Mit jQuery auf DOM zugreifen

Um ein DOM Element mit jQuery zu finden, übergibst du der jQuery Funktion einfach einen gültigen CSS Selektor:

$("h1"); // Selektiert alle h1s
$("#heading"); // Selektiert das Element mit der id "heading"
$(".warning"); // Selektiert alle Elemente mit der Klasse "warning"

Beachte, dass die JQuery Funktion sowohl $ als auch JQuery genannt werden kann, daher machen die folgenden Zeilen das Gleiche:

jQuery("h1");  
jQuery("#heading");  
jQuery(".warning");

Viele Leute bevorzugen $, da es einfach kürzer zu schreiben ist.

Die Funktion jQuery gibt immer eine jQuery-Collection der gefundenen, übereinstimmenden Elemente zurück. Dies sogar dann, wenn sie nur ein oder gar kein Element gefunden hat. In der Dokumentation kannst du mehr zur Funktion jQuery lesen.

Wenn du ein DOM Element mit JQuery gefunden hast, kannst du Dinge tun wie den Inhalt mit text() verändern: $("#temperature").text("89° Fahrenheit"); (See full example)

Du kannst die gleiche Methode text() auch verwenden, um den Inhalt abzufragen, indem du als Parameter 0 übergibst:
var heading = $("#heading").text();

Im nächsten Tutorial lernst du viel mehr Funktionen, um die Eigenschaften von DOM Elementen abzufragen und zu verändern.

Hinter den Kulissen verwenden die Funktionen von jQuery alle die DOM-API, welche wir im Kurs zu HTML/JS kennengelernt haben. So nutzt z. B. die Funktion $ Methoden wie getElementById() und querySelectorAll(). Und attr() verwendet die Methode getAttribute(). Wenn du die Funktion $ verwendest, kannst du diese Funktionen mit weniger Codezeilen verwenden, und weißt auch, dass dein Code in allen von jQuery unterstützten Browser funktioniert. Dies ist besonders wichtig, wenn du die neueren DOM-API-Funktionen verwenden möchtest.

Willst du an der Diskussion teilnehmen?

Anmelden

Sortiere nach:

Noch keine Beiträge.

Verstehst du Englisch? Klick hier, um weitere Diskussionen auf der englischen Khan Academy Seite zu sehen.