Jquery recherche l'opération de l'élément parent method_jquery

L'exemple de cet article décrit la méthode de fonctionnement de l'élément parent de recherche Jquery. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

1.Méthode parents()

Format :

Copier le code Le code est le suivant :

parents([sélecteur])

est utilisé pour obtenir la correspondance actuelle avec les éléments ancêtres de chaque élément de la collection d'éléments, et vous pouvez également utiliser un sélecteur pour filtrer si nécessaire.
Par exemple :

Copier le code Le code est le suivant :

$("p").parents().css ("border", "1px bleu uni);

2. méthode cloest

Format :

Copier le codeLe code est le suivant :

le plus proche(sélecteur[, contexte])

Cette méthode Partant de l'élément lui-même, elle correspond aux éléments supérieurs et renvoie le premier élément correspondant.
Par exemple :

Copier le code Le code est le suivant :

$("a").closest("div" ).css( "border", "1px solid blue");

Les principales différences entre les méthodes cloest() et parents() sont les suivantes :

① 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.

3. Méthode parent()

Format :

Copier le code Le code est le suivant :

parent([sélecteur])

est utilisé pour obtenir le courant Correspond à l'élément parent de chaque élément de la collection d'éléments, en filtrant éventuellement à l'aide d'un sélecteur.

Par exemple :

Copier le code Le code est le suivant :

$("p").parent( ).css( "border", "1px solid blue");

4. Méthode parentsUtil()

Format :

Copier le code Le code est le suivant :

parentsUtil([selector])

est utilisé pour obtenir le courant Correspond aux ancêtres de chaque élément dans l'ensemble d'éléments jusqu'à l'élément correspondant au sélecteur donné, mais non compris

Par exemple :

Copier le code Le code est le suivant :

$("li#li2"). parentsUtil("# ul1_li2").css("background", "#FCF");

5. Méthode offsetParent()

permet de rechercher l'élément parent positionné du premier élément correspondant. Il n'est valable que pour les éléments visibles. La syntaxe est la suivante :

Copier le code<.> Le code est le suivant :

offsetParent()

Cette méthode trouve l'élément positionné du premier élément correspondant et renvoie un objet jQuery enveloppé par cet élément.

Exemple complet :

Copier le code Le code est le suivant :

🎜> $(document).ready(function(){
$("p").parent().css("border","1px solid #999"); //Ajouter un style de bordure à l'élément parent de l'élément p
$("p").closest("div").css("color","blue"); //Définit la couleur de police pour le premier élément parent correspondant de l'élément p spécifié
$("li").parents("div").css("background","#FCF").css("height","40px");//Définir le style de l'élément div dans l'ancêtre li élément.
$("p").css("background","#99C");
})

• Actualités
• Page Web
• Tieba
• Savoir
• MP3
• Photos
• Vidéo
• Carte

Titre 1

Paragraphe 1

Titre 2

Paragraphe 2

Titre Trois

Paragraphe 3

L'effet de l'opération est comme indiqué ci-dessous :




J'espère que cet article sera utile à la programmation jQuery de chacun.