jQuery Traversant

❮ Précédent Suivant Chapitre ❯

Un ancêtre est un parent, grand-parent, grand-parent, et ainsi de suite.

Avec jQuery, vous pouvez parcourir l'arborescence DOM pour trouver les ancêtres d'un élément.

Traversant l'arbre DOM

Trois méthodes jQuery utiles pour parcourir l'arborescence DOM sont:

parent()
parents()
parentsUntil()

jQuery parent() Méthode

Le parent() méthode retourne l'élément parent direct de l'élément sélectionné.

Cette méthode ne traverse qu'un seul niveau dans l'arborescence DOM.

L'exemple suivant renvoie l'élément parent direct de chaque <span> éléments:

Exemple

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

Essayez - le vous - même »

jQuery les parents() Méthode

Les parents() , (<html>) parents() méthode renvoie tous les éléments ancêtres de l'élément sélectionné, tout le chemin jusqu'à l'élément racine du document (<html>) .

L'exemple suivant renvoie tous les ancêtres de tous les <span> éléments:

Exemple

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

Essayez - le vous - même »

Vous pouvez également utiliser un paramètre optionnel pour filtrer la recherche d'ancêtres.

L'exemple suivant renvoie tous les ancêtres de tous les <span> éléments qui sont <ul> éléments:

Exemple

$(document).ready(function(){
$("span").parents("ul");
});

Essayez - le vous - même »

jQuery parentsUntil() Méthode

Le parentsUntil() méthode renvoie tous les éléments ancêtres entre deux arguments donnés.

L'exemple suivant renvoie tous les éléments ancêtres entre un <span> et un <div> élément:

Exemple

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

Essayez - le vous - même »

Testez-vous avec des exercices!

Exercice 1 » Exercice 2» Exercice 3 » Exercice 4»