Heim >Web-Frontend >js-Tutorial >Analyse der jQuery.andSelf()-Funktionsnutzung

Analyse der jQuery.andSelf()-Funktionsnutzung

巴扎黑
巴扎黑Original
2017-06-24 10:28:471727Durchsuche

Die Funktion

andSelf() wird verwendet, um das zuvor übereinstimmende Element zum aktuell übereinstimmenden Element hinzuzufügen und es in Form eines neuen jQuery-Objekts zurückzugeben.

Das aktuelle jQuery-Objekt kann durch Aufrufen einer bestimmten Methode anderer jQuery-Objekte erstellt werden. Mit dieser Funktion wird ein neues jQuery-Objekt zurückgegeben, das alle Übereinstimmungen zwischen dem aktuellen jQuery-Objekt und dem jQuery-Objekt enthält, das es zuvor erstellt hat. Element.

Diese Funktion gehört zum jQuery-Objekt (Instanz).

Syntax

Diese Funktion wurde in jQuery 1.2 hinzugefügt, ist jedoch ab 1.8 als veraltet markiert. Verwenden Sie ab jQuery 1.8 stattdessen die Funktion addBack().

jQueryObject.andSelf( )

Rückgabewert

andSelf()Der Rückgabewert der Funktion ist vom Typ jQuery und gibt ein neues jQuery-Objekt zurück, das alle Elemente enthält, die mit dem aktuellen jQuery-Objekt und dem jQuery-Objekt, das es erstellt hat, übereinstimmen.

Wenn kein passendes Element vorhanden ist, wird ein leeres jQuery-Objekt zurückgegeben.

Ab jQuery 1.8 ist die andSelf()-Funktion ein Alias ​​der addBack()-Funktion.

Details: Wenn ein jQuery-Objekt erstellt wird, gibt es ein internes Attribut(prevObject), das die Referenz des jQuery-Objekts speichert, das es erstellt hat. Wenn die Funktion andSelf() aufgerufen wird, werden die aktuelle jQuery und das jQuery-Objekt, das sie erstellt hat, über die Funktion add() verbunden und ein neues jQuery-Objekt zurückgegeben.

Beispiel und Beschreibung

Nehmen Sie den folgenden HTML-Code als Beispiel:

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

Der folgende jQuery-Beispielcode wird verwendet, um die spezifische Verwendung von andSelf() zu demonstrieren. Funktion:

//返回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的特定方法创建,使用andSelf()将返回一个新的jQuery对象
// 该对象所匹配的元素是$p和$label两者的匹配元素之和
var $pAndLabel = $label.andSelf();
document.writeln( getTagsInfo( $pAndLabel ) ); // #n1,#n4,#n9,#n11
// 所有包含类名"active"的span元素和它们的上一个紧邻的同辈元素
var $elements =  $("span.active").prev().andSelf();
document.writeln( getTagsInfo( $elements ) ); // #n7,#n8,#n11,#n12
// andSelf()之前有3个jQuery对象:
// 第1个:$("p")
// 第2个:$("p").find("strong")
// 第3个:$("p").find("strong").siblings(".active")
// 调用andSelf()的是第3个对象,创建该对象的是第2个对象
// 因此andSelf()返回包含第3个对象和第2个对象的匹配元素之和的jQuery对象
var $matches = $("p").find("strong").siblings(".active").andSelf();
document.writeln( getTagsInfo( $matches ) ); // #n7,#n8

Das obige ist der detaillierte Inhalt vonAnalyse der jQuery.andSelf()-Funktionsnutzung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn