Introduction aux descendants des ancêtres du sélecteur de descendants de jQuery et exemple d'analyse

le sélecteur d'ancêtre descendant de jQuery (sélecteur de descendant) est utilisé pour faire correspondre tous les éléments descendants de l'élément ancêtre et les encapsuler sous forme de jQuery

et retour.

Remarque : La portée de recherche du descendant du sélecteur concerne les éléments descendants de "l'élément ancêtre", qu'il s'agisse de l'élément descendant de "l'élément ancêtre", du "petit-enfant" ou du plus "descendant". éléments.

Si vous souhaitez uniquement rechercher des éléments descendants, utilisez le sélecteur de descendants (parent > enfant).

// 这里的ancestor表示具体的祖先选择器
// 这里的descendant表示具体的后代选择器
jQuery( "ancestor descendant" )

Paramètres

Paramètres                                                                                                                                                   .

descendant Un sélecteur de descendant valide.

Valeur de retour

Renvoie un objet jQuery qui encapsule l'élément DOM correspondant au sélecteur descendant trouvé dans l'élément DOM correspondant au sélecteur ancêtre.

Si aucun élément DOM correspondant au sélecteur d'ancêtre n'est trouvé, ou qu'aucun élément DOM correspondant au sélecteur de descendant n'est trouvé dans un élément DOM correspondant au sélecteur d'ancêtre, un objet jQuery vide est renvoyé.

Il peut y avoir plusieurs éléments DOM ancêtres qui correspondent au sélecteur d'ancêtre, et plusieurs éléments DOM descendants peuvent être trouvés dans un élément DOM ancêtre. L'objet jQuery renvoyé encapsule tous les éléments DOM qui remplissent les conditions.

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>
    </p>
    <p id="n4" class="detail">
        <span id="n5" class="b codeplayer">World
            <span id="n6" class="c">365mini.com</span>
        </span>
    </p>
</div>

Maintenant, nous voulons trouver toutes les balises avec l'identifiant n1 en même temps, la balise p, vous pouvez écrire le code jQuery suivant :

// 选择了id分别为n2、n4的2个元素
$("#n1 p");
如果要一次性查找到p标签内的所有span标签，则对应的jQuery代码如下(上述示例HTML中所有的span标签都包括在内)：
// 选择了id分别为n3、n5、n6的3个元素
$("p span");
当然，祖先选择器和后代选择器可以是任意有效的选择器，因此它们本身也可以是一个"祖先-后代"选择器。
// 选择了id为n6的一个元素
$("#n1 p.detail span.c");

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!