L'exemple de cet article résume la méthode jQuery pour obtenir des éléments parents et des nœuds parents. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :
Il existe de nombreuses façons d'obtenir des éléments parents dans jquery, telles que parent(), parents(), close(), qui peuvent vous aider à trouver des éléments ou des nœuds parents. Expliquons-les un par un ci-dessous :
Donnons d'abord un exemple,
<ul class="parent1"> <li><a href="#" id="item1">jquery获取父节点</a></li> <li><a href="#">jquery获取父元素</a></li> </ul>
Notre objectif est d'obtenir l'élément ul avec la classe parent1 via la note a avec l'identifiant item1. Il existe plusieurs méthodes :
1. parent([expr])
Obtient un ensemble d'éléments contenant l'élément parent unique de tous les éléments correspondants.
Vous pouvez filtrer à l'aide d'expressions facultatives.
Le code est le suivant
$('#item1').parent().parent('.parent1');
2. :parent
Correspond aux éléments qui contiennent des éléments enfants ou du texte
Le code est le suivant
$('li:parent');
3. parents([expr])
Obtient un ensemble d'éléments contenant les éléments ancêtres de tous les éléments correspondants (à l'exclusion de l'élément racine). Peut être filtré par une expression facultative.
Le code est le suivant
$('#items').parents('.parent1');
4. le plus proche([expr])
closest vérifiera d'abord si l'élément actuel correspond, et s'il correspond, il renverra directement l'élément lui-même. S'il n'y a pas de correspondance, recherchez l'élément parent vers le haut, couche par couche, jusqu'à ce qu'un élément correspondant au sélecteur soit trouvé. Si rien n'est trouvé, un objet jQuery vide est renvoyé.
La principale différence entre les plus proches et les parents est :
① Le premier commence la correspondance et la recherche à partir de l'élément actuel, et le second commence la correspondance et la recherche à partir de l'élément parent
;
② Le premier recherche vers le haut étape par étape jusqu'à ce qu'il trouve un élément correspondant, puis s'arrête. Le second recherche vers le haut jusqu'à l'élément racine, puis place ces éléments dans une collection temporaire, puis utilise l'expression de sélection donnée pour filtrer
;
③ Le premier renvoie 0 ou 1 élément, et le second peut contenir 0, 1 ou plusieurs éléments.
le plus proche est utile pour gérer la délégation d'événements.
$('#items1').closest('.parent1');
Les lecteurs intéressés par davantage de contenu lié à jQuery peuvent consulter les sujets spéciaux sur ce site : "Algorithme de traversée JQuery et résumé des compétences", "Résumé des compétences d'opération de table jQuery (table) " , "Résumé des effets et techniques de glisser jQuery", "Résumé des techniques d'extension jQuery", "Résumé des effets spéciaux classiques courants jQuery" , "Résumé de l'utilisation des animations et des effets spéciaux jQuery", "Résumé de l'utilisation du sélecteur jquery" et "Plug-ins communs jQuery et résumé de l'utilisation"
J'espère que cet article sera utile à tous ceux qui programment jQuery.