Maison > interface Web > js tutoriel > Explication détaillée du sélecteur jQuery (précédent ~ frères et sœurs)

Explication détaillée du sélecteur jQuery (précédent ~ frères et sœurs)

巴扎黑
Libérer: 2017-06-22 13:20:37
original
1702 Les gens l'ont consulté

jQuery prev ~ Le sélecteur de frères et sœurs est utilisé pour faire correspondre les éléments frères et sœurs de tous les frères et sœurs après l'élément précédent, les encapsuler dans des objets jQuery et retournez-les.

Remarque : La plage de recherche des frères et sœurs du sélecteur doit être constituée des éléments après "l'élément précédent" et être des éléments frères (c'est-à-dire qu'ils ont le même élément parent que "l'élément précédent").

Grammaire

// 这里的prev表示具体的选择器
// 这里的siblings表示具体的选择器
jQuery( "prev ~ siblings" )
Copier après la connexion

Les espaces de part et d'autre du symbole ~ peuvent être omis, mais il n'est pas recommandé de les omettre, sinon les caractères pourraient être trop rapprochés pour affecter la lecture.

Paramètres

Description du paramètre

prev Un sélecteur valide.

frères et sœurs Un sélecteur valide.

Valeur de retour

Renvoie un objet jQuery qui encapsule les éléments DOM qui correspondent aux frères et sœurs du sélecteur et sont situés dans les éléments frères après "l'élément précédent".

Si aucune correspondance correspondante n'est trouvée, un objet jQuery vide est renvoyé.

Exemple et description

Prenons le code HTML suivant comme exemple :

<div id="n1">
    <p id="n2" class="test">
        <span id="n3" class="a">Hello</span>
        <span id="n4">Hello</span>
    </p>
    <p id="n5" class="detail">
        <span id="n6" class="b codeplayer">World
            <span id="n7" class="a">http://365mini.com</span>
            <span id="n8"></span>
            <span id="n9"></span>
        </span>
    </p>
</div>
Copier après la connexion

Maintenant, si nous voulons trouver la balise peer p après la balise p, nous peut écrire le code jQuery suivant :

// 选择了id为n5的一个元素
$("p ~ p");
Copier après la connexion

Ensuite, nous trouvons la balise span frère située après la balise span avec l'identifiant n8, puis nous pouvons écrire le code jQuery suivant :

// 选择了id为n9的一个元素
// n7虽然也是n8的同辈元素,但不在n8之后,而是之前,因此匹配不到
$("#n8 ~ span");
Copier après la connexion

Recherchez la balise span localisée. Le code jQuery correspondant pour les balises span homologues suivantes est le suivant :

// 选择了id分别为n4、n8、n9的三个元素
// n9属于n7的~siblings,也是n8的~siblings,同一个元素只计入一次
$("span ~ span");
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal