Derniers tutoriels de développement web
 

jQuery closest() Method

<Méthodes jQuery Traversant

Exemple

Retour le premier ancêtre de <span> , qui est un <ul> élément:

$(document).ready(function(){
    $("span").closest("ul").css({"color": "red", "border": "2px solid red"});
});

Résultat:

body (great-great-grandparent)
div (great-grandparent)
    ul (second ancestor - second grandparent)
      ul (first ancestor - first grandparent)
    • li (direct parent)  span  
     
Essayez - le vous - même »

Définition et utilisation

Le closest() méthode renvoie le premier ancêtre de l'élément sélectionné.

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

L'arbre DOM: Cette méthode traverse vers le haut de l'élément courant, tout le chemin jusqu'à l'élément racine du document (<html>) , pour trouver le premier ancêtre des éléments DOM.

Cette méthode est similaire à des parents() , en ce qu'elles traversent l'arbre DOM. Les différences sont les suivantes:

closest()

  • Commence par l'élément courant
  • Voyage dans l'arbre DOM et renvoie le premier (seul) ancêtre qui correspond à l'expression passée
  • L'objet jQuery retourné contient zéro ou un élément

parents()

  • Commence avec l'élément parent
  • Voyage dans l'arbre DOM et renvoie tous les ancêtres qui correspond à l'expression passée
  • L'objet jQuery retourné contient zéro ou plus d'un élément

D' autres méthodes connexes:

  • parent() - retourne l'élément parent direct de l'élément sélectionné
  • parentsUntil() - renvoie tous les éléments ancêtres entre deux arguments donnés

Syntaxe

Retour le premier ancêtre de l'élément sélectionné:

$(selector).closest( filter )

Retour le premier ancêtre en utilisant un contexte de DOM pour rechercher l'arbre DOM dans le secteur:

$(selector).closest( filter,context )

Paramètre La description
filter Obligatoire. Spécifie une expression de sélection, élément ou objet jQuery pour affiner la recherche des ancêtres
context Optionnel. Un élément DOM à l'intérieur duquel un élément d'adaptation peut être trouvé

Essayez-le vous-même - Exemples

Retour le premier ancêtre de <span> , qui est un <span> élément
Parce que cette méthode commence avec l'élément courant, une recherche pour la première <span> de <span> , sera de retour <span> .

Passer dans un élément DOM que le contexte dans lequel rechercher le premier élément ancêtre
En utilisant les deux paramètres à passer dans un élément DOM que le contexte dans lequel à la recherche de la première <ul> élément.


<Méthodes jQuery Traversant