Anweisungen zur Verwendung von every() in JQuery

Für das jQuery-Objekt 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 gilt für das durch Parameter eins bereitgestellte Objekt. Alle Unterelemente in der Methode werden einzeln aufgerufen. Die Funktion

each() ist eine Werkzeugfunktion, die von praktisch allen Frameworks bereitgestellt wird. Mit ihr können Sie Objekte durchlaufen. Attributwerte und verarbeiten 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 Wirkung jeder Funktion ist je nach Art der Parameter nicht vollständig konsistent:

1. Objekte durchqueren (mit zusätzlichen Parametern)

Die Der Code lautet wie folgt:

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

2. Das Array durchlaufen (mit Anhangsparametern)

Der Code lautet wie folgt:

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

3. Objekte durchqueren (keine zusätzlichen Parameter)

Der Code lautet wie folgt:

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

4 (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 der einzelnen Methoden von jQuery

var arr = [ "one", "two", "three", "four"];  
 $.each(arr, function(){  
 alert(this);  
 });  
//上面这个each输出的结果分别为：one,two,three,four  
  
var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]  
$.each(arr1, function(i, item){  
 alert(item[0]);  
});  
//其实arr1为一个二维数组，item相当于取每一个一维数组，  
//item[0]相对于取每一个一维数组里的第一个值  
//所以上面这个each输出分别为：1 4 7  
 
 
var obj = { one:1, two:2, three:3, four:4};  
$.each(obj, function(key, val) {  
 alert(obj[key]);    
});  
//这个each就有更厉害了，能循环每一个属性  
//输出结果为：1 2 3 4

Die Each-Funktion in JQuery wird in der offiziellen Dokumentation von 1.3.2 wie folgt beschrieben:

each(callback)

Nehmen Sie jedes passende Element als Kontext, um eine Funktion auszuführen.
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). Geben Sie „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-Attribut fest. Hinweis: Hier bezieht sich dies auf das DOM-Objekt und nicht auf das jQuery-Objekt.

HTML-Code:

Der Code lautet wie folgt:

<img/><img/>jQuery 代码: 
$("img").each(function(i){ 
this.src = "test" + i + ".jpg"; 
});

Ergebnis: [ 3aea8968b3b2aa1ea131ed451e23e3c6, 9b5906d777c3e5ae0f60d33152154aa9 ]
Natürlich ermöglicht jquery ein benutzerdefiniertes Popup beim Durchlaufen von Elementen: Sie können „return“ verwenden, um jedes Element zu verlassen () im Voraus.
HTML-Code:

Der Code lautet wie folgt:

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

jQuery-Code:

Der Code lautet wie folgt :

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

Oder schreiben Sie so:

Der Code lautet wie folgt:

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

Abbildung:


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

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 die „this“-Selektor-

-Instanz
verwenden, um den Text jedes li-Elements auszugeben:

Code kopieren Der Code lautet wie folgt:

$("button").click(function(){
$( "li").each (function(){
alert($(this).text())
});

Das obj-Objekt ist kein Array

Der größte Unterschied zwischen dieser Methode und 1 besteht darin, dass die fn-Methode unabhängig vom Rückgabewert einzeln ausgeführt wird des obj-Objekts wird von der fn-Methode aufgerufen, auch wenn fn verwendet wird. Die übergebenen Parameter ähneln 1.

Code kopierenDer Der Code lautet wie folgt:

jQuery.each=function( obj, fn, args ) {
if ( args ) {
if ( obj.length == undefiniert ){
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 == undefiniert ) {
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;

Es ist 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 in der Form von fn.apply(obj.args), was bedeutet, dass Sie in Ihrer eigenen Implementierung von fn diesen Zeiger direkt verwenden können, um auf die Unterelemente des Arrays oder Objekts zu verweisen.

Wie man dann aus jedem herausspringt

Es ist bequemer, jedes zu verwenden, wenn jquery das ausgewählte Objekt durchläuft. Es gibt eine Anwendung, die aus dieser Schleife ausbrechen muss, nachdem sie ein Objekt gefunden hat, das die Bedingungen erfüllt. Um aus einer JavaScript-Schleife auszubrechen, wird im Allgemeinen Break verwendet. Als ein Kollege auf dieses Problem stieß, benutzte er unbewusst Break, um aus der Schleife auszubrechen. Das Ergebnis ist ein Fehler
SyntaxError: unbeschrifteter Bruch muss sich in einer Schleife oder einem Schalter befinden
Nach der Untersuchung sollten Sie einen
verwenden, um in der Rückruffunktion „false“ zurückzugeben. Die meisten jq-Methoden sind so




Code kopieren

Der Code lautet wie folgt:

Die Rückgabe von „false“ stoppt die Schleife (genau wie die Verwendung von „break“ in einer normalen Schleife). .

Geben Sie „true“ zurück, um zur nächsten Schleife zu springen (genau wie die Verwendung von „continue“ in einer normalen Schleife).

Das obige ist der detaillierte Inhalt vonAnweisungen zur Verwendung von every() in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!