Verwendung von $.each in JQuery und der Unterschied zu $(selector).each()-js-Tutorial-php.cn

Verwendung von $.each in JQuery und der Unterschied zu $(selector).each()

伊谢尔伦

Freigeben： 2017-06-17 14:37:47

Original

1023 Leute haben es durchsucht

Die

each()-Methode kann die DOM-Schleifenstruktur prägnant und weniger fehleranfällig machen. Die Funktion every() kapselt eine sehr leistungsfähige Traversierungsfunktion und ist sehr praktisch zu verwenden. Sie kann eindimensionale Arrays, mehrdimensionale Arrays, DOM, JSON usw. durchlaufen. während des JavaScript-Entwicklungsprozesses Die Verwendung von $each kann unsere Arbeitsbelastung erheblich reduzieren.

Beispiel für die Methode „each()“:

var arr = [ "aaa", "bbb", "ccc" ];
$.each(arr, function(i,a){
alert(i); // i 是循环的序数
alert(a); // a 是值
});
var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]
$.each(arr1, function(i, item){
alert(item[0]);
});

Nach dem Login kopieren

Tatsächlich ist arr1 ein zweidimensionales Array, item entspricht der Aufnahme jedes eindimensionalen Arrays
item[ 0] Relativ zur Annahme des ersten Werts in jedem eindimensionalen Array
Die Ausgabe von jedem oben ist also: 1 4 7

Eine allgemeine Traversierungsfunktion, die verwendet werden kann, um Durchlaufen von Objekten und Arrays. Arrays und Pseudo-Array-Objekte, die ein Längenattribut enthalten (Pseudo-Array-Objekte wie das Argumentobjekt einer Funktion), werden mit einem numerischen Index von 0 bis Länge-1 durchlaufen, und andere Objekte auch wird über das Attribut durchlaufen.

$.each() unterscheidet sich von $(selector).each(). Letzteres wird speziell zum Durchlaufen von JQuery-Objekten verwendet ist ein Array oder ein Objekt). 🎜>javascript umhüllt diesen Wert immer als Objekt – auch wenn es sich um einen String oder eine Zahl handelt), gibt die Methode den ersten Parameter des durchlaufenen Objekts zurück. Beispiel:————Übergabe eines Arrays

<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<script>
 
$.each([52, 97], function(index, value) {
alert(index + ‘: ‘ + value);
});
 
</script>
</body>
</html>

Nach dem Login kopieren

Beispiel:————Wenn eine Karte als verwendet wird Sammlung, die Rückruffunktion übergibt ein Schlüssel-Wert-Paar

//输出
 
0: 52
1: 97

Nach dem Login kopieren

<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<script>
 
var map = {
‘flammable&#39;: ‘inflammable&#39;,
‘duh&#39;: ‘no duh&#39;
};
$.each(map, function(key, value) {
alert(key + ‘: ‘ + value);
});
 
</script>
</body>
</html>

Nach dem Login kopieren

Beispiel: --- Sie können $.each() beenden, wenn Sie im Rückruf false zurückgeben Funktion, wenn sie ein nicht-falsches Ergebnis zurückgibt. Das heißt, genau wie bei der Verwendung von continue in der

//输出
 
flammable: inflammable
duh: no duh

Nach dem Login kopieren

for-Schleife

wird sofort in die nächste Durchquerung

< eingetreten 🎜> Beispiel: ---

<!DOCTYPE html>
<html>
<head>
  <style>
  p { color:blue; }
  p#five { color:red; }
  </style>
  <script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
 
<body>
  <p id=”one”></p>
  <p id=”two”></p>
  <p id=”three”></p>
  <p id=”four”></p>
  <p id=”five”></p>
<script>
    var arr = [ "one", "two", "three", "four", "five" ];//数组
    var obj = { one:1, two:2, three:3, four:4, five:5 }; // 对象
    jQuery.each(arr, function() {  // this 指定值
      $(“#” + this).text(“Mine is ” + this + “.”);  // this指向为数组的值, 如one, two
       return (this != “three”); // 如果this = three 则退出遍历
   });
    jQuery.each(obj, function(i, val) {  // i 指向键, val指定值
      $(“#” + i).append(document.createTextNode(” – ” + val));
    });
</script>
</body>
</html>

Nach dem Login kopieren

Elemente des Arrays durchlaufen

// 输出
 
Mine is one. – 1
Mine is two. – 2
Mine is three. – 3
- 4
- 5

Nach dem Login kopieren

, Index und Wert übergeben

Beispiel: - Eigenschaften des Objekts durchlaufen , übergeben Sie Schlüssel und Wert

<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<script>
$.each( [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;], function(i, l){
alert( “Index #” + i + “: ” + l );
});
 
</script>
</body>
</html>

Nach dem Login kopieren

Beispiel für einen Selbstkommentar

<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<script>
 
$.each( { name: “John”, lang: “JS” }, function(k, v){
alert( “Key: ” + k + “, Value: ” + v );
});
 
</script>
</body>
</html>

Nach dem Login kopieren

1. Wenn Sie den ersten nicht ausgeben möchten item (verwenden Sie rerun true) und geben Sie die nächste Iteration ein

Das obige ist der detaillierte Inhalt vonVerwendung von $.each in JQuery und der Unterschied zu $(selector).each(). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!