Maison  >  Article  >  interface Web  >  Explication détaillée des exemples d'utilisation de la fonction jQuery.addBack()

Explication détaillée des exemples d'utilisation de la fonction jQuery.addBack()

巴扎黑
巴扎黑original
2017-07-08 13:10:222127parcourir

La fonction addBack() est utilisée pour ajouter l'élément précédemment correspondant à l'élément actuellement correspondant et le renvoyer sous la forme d'un nouvel objet jQuery.

L'objet jQuery actuel peut être créé en appelant une méthode spécifique d'autres objets jQuery. L'utilisation de cette fonction renverra un nouvel objet jQuery qui contient toutes les correspondances entre l'objet jQuery actuel et l'objet jQuery qui l'a créé précédemment. élément.

Vous pouvez également utiliser des sélecteurs pour restreindre davantage la portée de l'ajout et ajouter uniquement des éléments qui correspondent au sélecteur spécifié dans l'objet jQuery précédent.

Cette fonction appartient à l'objet (instance) jQuery.

Syntaxe

jQuery 1.8 a ajouté cette fonction. La fonction andSelf() est un alias pour cette fonction (la fonction andSelf() est obsolète depuis la version 1.8).

jQueryObject.addBack( [ sélecteur ] )

Paramètres

Paramètres

Description

selector Facultatif/StringSelectorString spécifié par type.

Si le paramètre selector est omis, tous les éléments correspondants de l'objet jQuery précédent seront ajoutés.

Valeur de retour

addBack()La valeur de retour de la fonction est de type jQuery, renvoyant un nouvel objet jQuery qui contient tous les éléments correspondants de l'objet jQuery actuel et Crée les éléments correspondant au sélecteur spécifié parmi les éléments correspondants de l'objet jQuery de l'objet jQuery actuel.

S'il n'y a aucun élément correspondant, renvoie un objet jQuery vide.

À partir de jQuery 1.8, la fonction andSelf() est un alias de cette fonction.

Détails : Lorsqu'un objet jQuery est créé, il existe un attribut interne (prevObject) qui enregistrera une référence à l'objet jQuery qui l'a créé. Lorsque la fonction addBack() est appelée, le jQuery actuel et l'objet jQuery qui l'a créé sont connectés via la fonction add() et un nouvel objet jQuery est renvoyé.

Exemple et description

Prenons le code HTML suivant comme exemple :

<p id="n1">
    <span id="n2">
        <span id="n3">A</span>
    </span>
    <label id="n4">B</label>
    <span id="n5">
        <span id="n6">C</span>
    </span>
    <strong id="n7" class="active">D</strong>
    <span id="n8" class="active">E</span>
</p>
<p id="n9">
    <span id="n10"></span>
    <label id="n11"></label>
    <span id="n12" class="active"></span>
</p>

L'exemple de code jQuery suivant est utilisé pour démontrer l'utilisation spécifique de addBack() fonction :

//返回jQuery对象所有匹配元素的标识信息数组
//每个元素形如:#id
function getTagsInfo($doms){
    return $doms.map(function(){
        return "#" + this.id;
    }).get();
}
//匹配所有的p元素
var $p = $("p");
//选取所有p元素的后代label元素
var $label = $p.find("label");
//由于jQuery对象$label是通过$p的特定方法创建,使用addBack()将返回一个新的jQuery对象
//该对象所匹配的元素是$p和$label两者的匹配元素之和
var $pAndLabel = $label.addBack();
document.writeln( getTagsInfo( $pAndLabel ) ); // #n1,#n4,#n9,#n11
// 所有包含类名"active"的元素的上一个紧邻的同辈元素(#)
// 再加上所有包含类名"active"的元素中的span元素
var $elements =  $(".active").prev().addBack("span");
document.writeln( getTagsInfo( $elements ) ); // #n5,#n7,#n8,#n11,#n12
//addBack()之前有3个jQuery对象:
//第1个:$("p")
//第2个:$("p").find("strong")
//第3个:$("p").find("strong").siblings(".active")
//调用addBack()的是第3个对象,创建该对象的是第2个对象
//因此addBack()返回包含第3个对象和第2个对象的匹配元素之和的jQuery对象
var $matches = $("p").find("strong").siblings(".active").addBack();
document.writeln( getTagsInfo( $matches ) ); // #n7,#n8

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!

Déclaration:
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