jQuery.each( collection, callback(indexInArray, valueOfElement) )详解+练习
公西运良
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
</head>
<style type="text/css">
div {
color: blue;
}
div#five {
color: red;
}
</style>
<body>
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div id="four"></div>
<div id="five"></div>
<script type="text/javascript">
/*
* jQuery.each(collection,callback(indexInArray,valueOfElement)) 返回：Object
*描述：一个通用的迭代函数，它可以用来无缝迭代对象和数组。数组和类似数组
* 的对象通过一个长度属性（如一个函数的参数对象）来迭代数组索引，从0到
* length-1,其他对象通过其属性名进行迭代。
* */
/**
* 1.jQuery.each(array,callback)
* array
* 类型：Array
* 遍历的数组
*
* callback
* 类型：Function(Integer indexInArray,Object value)
* 该函数会在每个对象上（迭代）调用
* */
/**
* 2.jQuery.each(object,callback)
* object
* 类型：Object
* 遍历的对象
*
* callback
* 类型：Function(String propertyName,Object valueOfProperty)
* 该函数会在每个对象上（迭代）调用
* */
//注意：############
/**
* $.each()函数和$(selector).each()是不一样的，那个是专门用来遍历一个
* jQuery对象。
* $.each()函数可用于迭代任何集合，无论是“名/值”对象或一个数组，在迭代
* 数组的情况下，回调函数每次传递一个数组索引和相应的数组值作为参数。（
* 该值也可以通过访问this关键字得到，但是javaScript始终将this值作为一个
* Object，即使他是一个简单的字符串或数字值），
* 该方法返回其第一个参数，这是迭代的对象。
*
* $each()函数会在内部检索并使用传递集合的length属性，所以，如果集合有
* 一个名为length的属性，比如{bar:"fool",length:10},这个函数可能无法正常
* 工作
* */
var person = {name:"Bob",sex:"man"};
$.each(person, function(index,val) {
console.log(index + " : " + val);
});
//可以在$each()返回false来终止迭代，
var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one: 1, two: 2, three: 3, four: 4, five: 5 };
jQuery.each(arr,function(i,val){
$("#" + val).text("Mine is " + val + "." );
//在3之后停止
return (val !== "three");
});
jQuery.each(obj,function(i,val){
$("#" + i).append(document.createTextNode(" - " + val));
});
var objTest = {name:"Jack",length:101};
jQuery.each(objTest,function(i,val){
console.log(i + " : " + val);
});
</script>
</body>
</html>
类似资料：