jQuery.addBack() 함수 사용 예에 ​​대한 자세한 설명

addBack() 함수는 이전에 일치된 요소를 현재 일치된 요소에 추가하고 이를 새로운 jQuery 개체의 형태로 반환하는 데 사용됩니다.

현재 jQuery 객체는 다른 jQuery 객체의 특정 메서드를 호출하여 생성될 수 있습니다. 이 함수를 사용하면 현재 jQuery 객체와 이전에 생성한 jQuery 객체의 일치하는 모든 요소를 ​​포함하는 새로운 jQuery 객체가 반환됩니다.

선택기를 사용하여 추가 범위를 더 좁힐 수도 있고, 이전 jQuery 개체에서 지정된 선택기와 일치하는 요소만 추가할 수도 있습니다.

이 함수는 jQuery 객체(인스턴스)에 속합니다.

Syntax

jQuery 1.8에 이 기능이 추가되었습니다. andSelf() 함수는 이 함수의 별칭입니다(andSelf() 함수는 1.8부터 사용되지 않습니다).

jQueryObject.addBack( [ selector ] )

parameters

parameter

description

selector Optional/String유형별로 지정된 선택기string입니다.

선택기 매개변수가 생략되면 이전 jQuery 객체와 일치하는 모든 요소가 추가됩니다.

반환 값

addBack()함수의 반환 값은 jQuery 유형으로, 현재 jQuery 객체와 일치하는 모든 요소와 현재 jQuery를 생성한 jQuery 객체의 일치하는 요소를 모두 포함하는 새 jQuery 객체를 반환합니다. 개체. 선택기를 지정하는 요소입니다.

일치하는 요소가 없으면 빈 jQuery 객체가 반환됩니다.

jQuery 1.8부터 andSelf() 함수는 이 함수의 별칭입니다.

세부 정보: jQuery 객체가 생성되면 이를 생성한 jQuery 객체에 대한 참조를 저장하는 내부 property(prevObject)가 있습니다. addBack() 함수가 호출되면 현재 jQuery와 이를 생성한 jQuery 객체가 add() 함수를 통해 연결되고, 새로운 jQuery 객체가 반환됩니다.

예제 및 설명

다음 HTML 코드를 예로 들어보세요.

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

다음 jQuery 샘플 코드는 addBack() 함수의 구체적인 사용법을 보여주기 위해 사용됩니다.

//返回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

위 내용은 jQuery.addBack() 함수 사용 예에 ​​대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!