jQuery-Throughgang - Nachkommen

Nachkommen sind Kinder, Enkelkinder, Urenkelkinder usw.

Mit jQuery können Sie den DOM-Baum nach unten traversieren, um Nachkommen von Elementen zu finden.

DOM-Baum nach unten traversieren

Hier sind zwei jQuery-Methoden zur Traversal des DOM-Baums nach unten:

  • children()
  • find()

jQuery children() Methode

Die Methode children() gibt alle direkten Kinder des ausgewählten Elements zurück.

Diese Methode traversiert nur eine Ebene des DOM-Baums weiter.

Der folgende Beispielcode gibt alle direkten Kinder jedes <div>-Elements zurück:

Beispiel

$("document").ready(function(){
  $("div").children();
);

Versuchen Sie es selbst

Sie können auch optionalen Parameter verwenden, um die Suche nach Kindelementen zu filtern.

Der folgende Beispielcode gibt alle <p>-Elemente zurück, die die Klasse "1" haben und direkte Kinder von <div> sind:

Beispiel

$("document").ready(function(){
  $("div").children("p.1");
);

Versuchen Sie es selbst

jQuery find() Methode

Die Methode find() gibt die Nachkommen der ausgewählten Elemente zurück, bis zum letzten Nachkommen.

Der folgende Beispielcode gibt alle <span>-Elemente zurück, die Nachkommen von <div> sind:

Beispiel

$("document").ready(function(){
  $("div").find("span");
);

Versuchen Sie es selbst

Der folgende Beispielcode gibt alle Nachkommen von <div> zurück:

Beispiel

$("document").ready(function(){
  $("div").find("*"});
);

Versuchen Sie es selbst

jQuery Referenzhandbuch zur Traversal

Um alle jQuery-Traversierungsmethoden zu erfahren, besuchen Sie bitte unsere jQuery Referenzhandbuch zur Traversal.