each() method:
$.each(array/object, function processing); //$Object The
$(selector) called. each(function processing); //jquery object called
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
function f1(){
//① 遍历对象
//$.each(对象,function(k对象属性变量,v对象属性值变量){});
var cat = {name:'kitty',age:5,climb:function(){console.log('在爬树');}};
jQuery.each(cat,function(k,v){
console.log(k+'---'+v);
});
//② 遍历数组
//$.each(数组,function(k元素下标变量,v元素值变量){});
var color = ['red','blue','green'];
jQuery.each(color,function(m,n){
console.log(m+'---'+n);
});
}
window.onload = function(){
//③ 遍历"jquery对象"
//$('li').each(function(w dom对象下标索引值,f代表具体的每个dom对象){});
$('li').each(function(w,f){
//this代表遍历出来的每个“dom对象”
//this ----> f
//this ----> li对象(dom对象)
console.log(w+"---"+f+"---"+this);
f.style.color = "blue";
});
}
</script>
<style type="text/css">
div {width:300px;height:200px; background-color:pink;}
</style>
</head>
<body>
<h2>each遍历方法</h2>
<div id="apple"></div>
<ul>
<li>北京</li>
<li>上海</li>
<li>深圳</li>
</ul>
<input type="button" value="触发1" onclick="f1()" />
</body>
</html>
Next Section