標籤：style http color java 使用 io strong for
譯自官方手冊:jQuery.each()對數組或對對象內容進行迴圈處理jQuery.each( collection, callback(indexInArray, valueOfElement) )collection 遍曆的對象或數組
callback(indexInArray, valueOfElement) 在每一個對象上調用的函數
說明
一個通用的遍曆函數 , 可以用來遍曆對象和數組. 數組和含有一個length屬性的偽數組對象 (偽數組對象如function的arguments對象)以數字索引進行遍曆,從0到length-1, 其它的對象通過的屬性進行遍曆.
$.each()與$(selector).each()不同, 後者專用於jquery對象的遍曆, 前者可用於遍曆任何的集合(無論是數組或對象),如果是數組,回呼函數每次傳入數組的索引和對應的值(值亦可以通過this 關鍵字擷取,但javascript總會封裝this 值作為一個對象—儘管是一個字串或是一個數字),方法會返回被遍曆對象的第一參數
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//例子:———傳入數組
<!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>
//輸出
0: 52 1: 97
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//例子:———如果一個映射作為集合使用,回呼函數每次傳入一個鍵-值對
<!DOCTYPE html> < html> < head> < script src=”http://code.jquery.com/jquery-latest.js”></script> < /head> < body> < script>
var map = { ‘flammable’: ‘inflammable’, ‘duh’: ‘no duh’ }; $.each(map, function(key, value) { alert(key + ‘: ‘ + value); });
</script> < /body> < /html>
//輸出
flammable: inflammable duh: no duh
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//例子:———回呼函數中 return false時可以退出$.each(), 如果返回一個非false 即會像在for迴圈中使用continue 一樣, 會立即進入下一個遍曆
<!DOCTYPE html>
<html>
<head>
<style>
div { color:blue; }
div#five { color:red; }
</style>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<div id=”one”></div>
<div id=”two”></div>
<div id=”three”></div>
<div id=”four”></div>
<div id=”five”></div>
<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>
// 輸出
Mine is one. – 1Mine is two. – 2Mine is three. – 3- 4- 5 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++//例子:———遍曆數組的項, 傳入index和value
<!DOCTYPE html> < html> < head> < script src=”http://code.jquery.com/jquery-latest.js”></script> < /head> < body> < script>$.each( [‘a‘,‘b‘,‘c‘], function(i, l){ alert( “Index #” + i + “: ” + l ); });
</script> < /body> < /html>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//例子:———遍曆對象的屬性,傳入 key和value
<!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>
正自評論的例子:
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1. 如果不想輸出第一項 (使用retrun true)進入 下一遍曆
<!DOCTYPE html> < html> < head> < script src=”http://code.jquery.com/jquery-latest.js”></script> < /head> < body> < script>
var myArray=["skipThis", "dothis", "andThis"]; $.each(myArray, function(index, value) { if (index == 0) { return true; // equivalent to ‘continue’ with a normal for loop } // else do stuff… alert (index + “: “+ value); });
</script> < /body> < /html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
