Detaillierte Erläuterung der Anwendungsbeispiele jeder Methode im JQuery-Objekt

Im jQuery-Objekt wird die Each-Methode einfach delegiert: Übergeben Sie das jQuery-Objekt als ersten Parameter an die Each-Methode von jQuery. Mit anderen Worten: Die von jQuery bereitgestellte Methode „Eached“ ruft die Methode nacheinander für alle Unterelemente des durch Parameter 1 bereitgestellten Objekts auf. Die Funktion „Every()“ ist eine Werkzeugfunktion, die im Grunde von allen Frameworks bereitgestellt wird Durchlaufen Sie die Attributwerte von Objekten und Arrays und verarbeiten Sie sie. Sowohl jQuery- als auch jQuery-Objekte implementieren diese Methode. Bei jQuery-Objekten wird die Each-Methode einfach delegiert: Das jQuery-Objekt wird als erster Parameter an die Each-Methode von jQuery übergeben. Mit anderen Worten: Die von jQuery bereitgestellte Each-Methode ist alle Unterelemente Das durch Parameter 1 bereitgestellte Objekt wird nacheinander aufgerufen. Die vom jQuery-Objekt bereitgestellte Methode „each“ ruft nacheinander die Unterelemente in jQuery auf.

Die Auswirkungen der einzelnen Funktionen sind je nach Art der Parameter nicht vollständig konsistent:

1. Objekte durchqueren (mit zusätzlichen Parametern)

$.each(Object, function(p1, p2) {    
   this;       //这里的this指向每次遍历中Object的当前属性值
  p1; p2;     //访问附加参数
}, ['参数1', '参数2']);

2 > Arrays durchlaufen (mit Anhangsparametern)

Der Code lautet wie folgt:

$.each(Array, function(p1, p2){    
  this;       //这里的this指向每次遍历中Array的当前元素
  p1; p2;     //访问附加参数
}, ['参数1', '参数2']);

3. Objekte durchlaufen (ohne zusätzliche Parameter)

Der Code lautet wie folgt:

$.each(Object, function(name, value) {     
       this;      //this指向当前属性的值
     name;      //name表示Object当前属性的名称
     value;     //value表示Object当前属性的值});

4. Durchlaufen Sie das Array (keine zusätzlichen Parameter)

Der Code lautet wie folgt:

$.each(Array, function(i, value) {     
      this;      //this指向当前元素
     i;         //i表示Array当前下标
     value;     //value表示Array当前元素});

Hier sind einige häufige Verwendungen von jQuery every-Methode:

every(callback)

Führen Sie eine Funktion mit jedem passenden Element als Kontext aus.
bedeutet, dass jedes Mal, wenn die übergebene Funktion ausgeführt wird, das Schlüsselwort this in der Funktion auf ein anderes DOM-Element verweist (jedes Mal ein anderes passendes Element). Darüber hinaus wird bei jeder Ausführung der Funktion ein numerischer Wert, der die Position des Elements als Ausführungsumgebung in der Menge übereinstimmender Elemente darstellt, als Parameter an die Funktion übergeben (eine Ganzzahl beginnend bei Null). Die Rückgabe von „false“ stoppt die Schleife (genau wie die Verwendung von „break“ in einer normalen Schleife). Gibt „true“ zurück, um zur nächsten Schleife zu springen (genau wie die Verwendung von „
continue“ in einer normalen Schleife). Der folgende Rückruf ist die
Rückruffunktion , die die Operation angibt, die beim Durchlaufen der Elemente ausgeführt werden soll. Beginnen wir unten mit einem einfachen Beispiel: Iterieren Sie über zwei Bilder und legen Sie deren SRC-Attribute fest. Hinweis: Hier bezieht sich dies auf das DOM-Objekt und nicht auf das jQuery-Objekt.

<img></img/>
$("img").each(function(i){ 
this.src = "test" + i + ".jpg"; 
}); 
结果:[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]

Natürlich erlaubt jquery benutzerdefinierte Sprünge beim Durchlaufen von Elementen. Bitte sehen Sie sich den Beispielcode an: Sie können „return“ verwenden, um vorab aus der every()-Schleife zu springen.

HTML-Code:

Der Code lautet wie folgt:

<button>Change colors</button>
<span></span>
<div></div>
<div></div>
<div></div>
<div></div>
<div id="stop">Stop here</div>
<div></div>
<div></div>
<div></div>

jQuery-Code:

Der Code lautet wie folgt:

each() gibt eine Funktion an, die für jedes übereinstimmende Element ausgeführt werden soll.

$("button").click(function(){
    $("div").each(function(index, domEle){
        $(domEle).css("backgroundColor", "wheat");
        if ($(this).is("#stop")) {
            $("span").text("在div块为#" + index + "的地方停止。");
            return false;
        }
    })
}

Tipp: Die Rückgabe von false kann verwendet werden, um die Schleife vorzeitig zu stoppen.

Syntax

$(selector).each(function(index,element)) Parameterbeschreibung
function(index,element) Erforderlich. Gibt die Funktion an, die für jedes übereinstimmende Element ausgeführt werden soll.
•index – die Indexposition des Selektors
•element – ​​das aktuelle Element (Sie können auch den Selektor „dieses“ verwenden

obj-Objekt ist kein Array

Der größte Unterschied zwischen Diese Methode und 1 sind: Die fn-Methode wird unabhängig vom Rückgabewert einzeln ausgeführt. Mit anderen Worten, alle Eigenschaften des obj-Objekts werden von der fn-Methode aufgerufen, auch wenn die fn-Funktion

zurückgibt

Es ist wichtig zu beachten, dass die spezifische Aufrufmethode von fn in jeder Methode nicht einfach fn(i, val) oder fn(args) ist, sondern fn.call(val,i,val) oder fn . apply(obj.args)-Formular, was bedeutet, dass Sie in Ihrer eigenen fn-Implementierung diesen Zeiger direkt verwenden können, um auf die Unterelemente des Arrays oder Objekts

jQuery.each = function(obj, fn, args){
    if (args) {
        if (obj.length == undefined) {
            for (var i in obj)
                fn.apply(obj, args);
        } else {
            for (var i = 0, ol = obj.length; i < ol; i++) {
                if (fn.apply(obj, args) === false)
                    break;
            }
        }
    } else {
        if (obj.length == undefined) {
            for (var i in obj)
                fn.call(obj, i, obj);
        } else {
            for (var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val, i, val) !== false; val = obj[++i]) {
            }
        }
    }
    return obj;
}

zu verweisen.

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Anwendungsbeispiele jeder Methode im JQuery-Objekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!