jQuery traversning - avkomlingar

Efterkommande är barn, barnbarn, barnbarns barn och så vidare.

Genom jQuery kan du traversera DOM-trädet nedåt för att hitta elementets efterkommande.

Nedåtsträvande traversering av DOM-trädet

Nedan är två jQuery-metoder för att traversera DOM-trädet nedåt:

  • children()
  • find()

jQuery children() metod

children() metoden returnerar alla direkta barn av det valda elementet.

Denna metod kommer bara att traversera ett steg ner i DOM-trädet.

Nedanstående exempel returnerar alla direkta barn av varje <div>-element:

Exempel

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

Prova själv

Du kan också använda valbara parametrar för att filtrera sökningen av barnen.

Nedanstående exempel returnerar alla <p>-element med klassen "1", och de är direkta barn av <div>:

Exempel

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

Prova själv

jQuery find() metod

find() metoden returnerar efterkommande element av valda element, ner till sista efterkommande.

Nedanstående exempel returnerar alla <span>-element som är efterkommande av <div>:

Exempel

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

Prova själv

Nedanstående exempel returnerar alla efterkommande av <div>:

Exempel

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

Prova själv

jQuery traverseringsreferenshandbok

För att lära dig alla jQuery traverseringsmetoder, besök vår jQuery traverseringsreferenshandbok。