jQuery Traversing - Afstammelingen

Met jQuery kun je door de DOM-boom bladeren om afstammelingen van een element te vinden.

Een afstammeling is een kind, kleinkind, achterkleinkind, enzovoort.

De DOM-boom afdalen

Twee handige jQuery-methoden om door de DOM-boom te bladeren zijn:

De children()methode retourneert alle directe onderliggende elementen van het geselecteerde element.

Deze methode doorloopt slechts één niveau in de DOM-boom.

Het volgende voorbeeld retourneert alle elementen die directe kinderen zijn van elk <div>element:

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

U kunt ook een optionele parameter gebruiken om de zoekopdracht voor kinderen te filteren.

Het volgende voorbeeld retourneert alle <p>elementen met de klassenaam "first", die directe kinderen zijn van <div>:

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

De find()methode retourneert afstammelingen van het geselecteerde element, helemaal tot aan de laatste afstammeling.

Het volgende voorbeeld retourneert alle <span>elementen die afstammelingen zijn van <div>:

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

Het volgende voorbeeld retourneert alle nakomelingen van <div>:

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

Ga voor een compleet overzicht van alle jQuery Traversing-methoden naar onze jQuery Traversing Reference .