Ancêtres dans le parcours jQuery

Les ancêtres sont le père, le grand-père, l'arrière-grand-père, etc.

Grâce à jQuery, vous pouvez itérer vers le haut dans l'arbre DOM pour trouver les éléments ancestor.

Itérer vers le haut dans l'arbre DOM

Ces méthodes jQuery sont très utiles, elles sont utilisées pour itérer vers le haut dans l'arbre DOM :

  • parent
  • parents
  • parentsUntil

Méthode parent() jQuery

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

Cette méthode ne parcourt que le niveau supérieur de l'arbre DOM.

Dans l'exemple suivant, l'élément parent direct de chaque élément <span> est retourné :

Exemple

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

Essayez-le vous-même

Méthode parents() jQuery

La méthode parents() retourne tous les éléments ancestor de l'élément sélectionné, allant jusqu'au root du document (<html>).

Dans l'exemple suivant, tous les éléments ancestor de tous les éléments <span> sont retournés :

Exemple

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

Essayez-le vous-même

Vous pouvez également utiliser des paramètres optionnels pour filtrer la recherche sur les éléments ancestor.

Dans l'exemple suivant, tous les éléments ancestor de tous les éléments <span> et qui sont des éléments <ul> sont retournés :

Exemple

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

Essayez-le vous-même

Méthode parentsUntil() jQuery

La méthode parentsUntil() retourne tous les éléments ancestor entre deux éléments donnés.

Dans l'exemple suivant, tous les éléments ancestor entre <span> et <div> sont retournés :

Exemple

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

Essayez-le vous-même

Guide de référence de l'itération jQuery

Pour connaître toutes les méthodes d'itération jQuery, veuillez visiter notre Guide de référence de l'itération jQuery。