Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung der Anwendungsbeispiele von every() in JQuery

Detaillierte Erläuterung der Anwendungsbeispiele von every() in JQuery

巴扎黑
巴扎黑Original
2017-07-09 11:42:451231Durchsuche

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 untergeordneten Elemente in der Methode rufen nacheinander auf

each(callback)

Verwenden Sie jedes passende Element als Kontext zum Ausführen einer Funktion.

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-Attribut fest. Hinweis: Hier bezieht sich dies auf das DOM-Objekt und nicht auf das jQuery-Objekt.

HTML-Code:

jQuery-Code:
$("img").each(function( i){
this.src = "test" + i + ".jpg"
}

Ergebnis:[ , ]
Natürlich ermöglicht jquery ein benutzerdefiniertes Popup beim Durchlaufen von Elementen: Sie können „return“ verwenden, um jedes () zu verlassen Vorwärts.
HTML-Code:

Der Code lautet wie folgt:


🎜>< ;p>


>





jQuery-Code:

Der Code lautet wie folgt:

$("button").click(function(){

$("p" ).each(function(index,domEle){
$(domEle).css("

Hintergrund

Farbe","Weizen");

if($(this).is(" #stop")){

$(" span").text("Stop where p block is #"+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("Stop where p block is #"+index+".");

return false;




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

Tipp: return false ist verfügbar
Syntax 🎜>$(selector).each(function(index,element)) Parameter Beschreibung
function(index,element) Erforderlich 🎜>•index – die Indexposition des Selektors
•element – ​​das aktuelle Element ( Sie können auch den Selektor „this“ verwenden

Beispiel
Geben Sie den Text jedes li-Elements aus:

Der Code lautet wie folgt:



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


Instanz

obj-Objekt ist kein Array

Der größte Unterschied zwischen dieser Methode und 1 besteht darin, dass die fn-Methode nacheinander ausgeführt wird, ohne den Rückgabewert zu berücksichtigen. Mit anderen Worten: Alle Eigenschaften des obj-Objekts werden von der fn-Methode aufgerufen, auch wenn die fn-Funktion false zurückgibt. Die im Aufruf übergebenen Parameter ähneln 1.

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 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) 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 springt man dann aus jedem heraus?

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. Javascript
verwendet im Allgemeinen Pause, um aus der Schleife auszubrechen
Als ein Kollege auf dieses Problem stieß, benutzte er unbewusst Pause, 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

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 vonDetaillierte Erläuterung der Anwendungsbeispiele von every() in JQuery. 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