jquery的.each()循环可以循环数组和对象，有2种写法，第二种该方法用来让DOM循环结构更简单更不易出错。它会迭代jQuery对象中的每一个DOM元素。每次回调函数执行时，会传递当前循环次数作为参数(从0开始计数)。更重要的是，回调函数是在当前DOM元素为上下文的语境中触发的。因此关键字 this 总是指向这个元素。
一、$.each()
写法：
$..each(obj, function(i, v) )
参数介绍：
- obj--要循环的量
- i--index
- v--value
循环数组：
var arr=['a','b'];
$.each(arr,function(i,v){
console.log(i);
console.log(v);
});
则打印结果为：
i-- 0 1
v-- a b
循环2维数组：
var arr2=[[1,2],[11,22]];
$.each(arr2,function(i,v){
console.log(i);
console.log(v);
});
则打印结果为：
i-- 0 1
v-- [1,2] [11,22]
循环对象：
var obj={a:'aa',b:'bb'};
$.each(obj,function(i,v){
console.log(i);
console.log(v);
});
则打印结果为：
i-- b b
v-- aa bb
jquery的.each()循环自动判断出数组或对象，后面有简介。
$.each()这种方法不支持dom选取，只能将要循环的量作为参数，操作dom将运用到方法二。
二、$().each()
写法：
$(elm).each(function(i,v){})
直接上代码：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <ul class="ul1"> <li>my</li> <li>name</li> <li>is</li> <li>nick</li> </ul> <script src="http://cdn.bootcss.com/jquery/2.2.1/jquery.js"></script> <script> $('.ul1 li').each(function(i,v){ console.log(i); console.log($(v).html()); }); </script> </body> </html>
则打印结果为：
i-- 0 1 2 3
v-- my name is nick
下面附上jqeury源码供参考：
function each( obj, callback, args ) {
var value,
i = 0,
length = obj.length,
isArray = isArraylike( obj );
if ( args ) {
if ( isArray ) {
for ( ; i < length; i++ ) {
value = callback.apply( obj[ i ], args );
if ( value === false ) {
break;
}
}
} else {
for ( i in obj ) {
value = callback.apply( obj[ i ], args );
if ( value === false ) {
break;
}
}
}
// A special, fast, case for the most common use of each
} else {
if ( isArray ) {
for ( ; i < length; i++ ) {
value = callback.call( obj[ i ], i, obj[ i ] );
if ( value === false ) {
break;
}
}
} else {
for ( i in obj ) {
value = callback.call( obj[ i ], i, obj[ i ] );
if ( value === false ) {
break;
}
}
}
}
return obj;
}
function isArraylike( obj ) {
var length = obj.length,
type = jQuery.type( obj );
if ( type === "function" || jQuery.isWindow( obj ) ) {
return false;
}
if ( obj.nodeType === 1 && length ) {
return true;
}
return type === "array" || length === 0 ||
typeof length === "number" && length > 0 && ( length - 1 ) in obj;
}
forEach是javascript原生的类似于jquery的循环机制，但不推荐使用！理由有：
- 不兼容某些老顽固浏览器，如ie8
- 只能循环数组，对象就不行了
如果你没有使用jquery，循环的话就用for或者for……in吧！