关于数组循环有以下主要内容
- for....in
- for
- $.each
for...in..
for...in..不是 很推荐使用循环数组,怕循环内部是否为扩展内容
<script>
var arr = [222,,44,556,6,76,7,765,765,7647];
for ( i in arr ){
console.log (arr[i]);
}
</script>
for
<script>
var arr = [222,4344,546,56,6765,765,74,544,24,4324,214];
for (var i=0; i<arr.length; i++){
console.log(arr[i]);
}
</script>
$.each
这个是jQuery里面的方法,这个方法很强大,可以循环多维数组
- 数组
<script>
var arr = [33,5656,56,564,54,743,653,625,5,543253,2342,4252,4325];
$.each(arr, function(i){
console.log(arr[i]);
})
</script>
以上效果都是一样的效果
- 处理二维数组
var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]
$.each(arr, function(i, item){
alert(i);
alert(item);
});
arr2为一个二维数组,item相当于取这二维数组中的每一个数组。
item[0]相对于取每一个一维数组里的第一个值
alert(i)将输出为0,1,2,因为这二维数组含有3个数组元素
alert(item)将输出为 ['a', 'aa', 'aaa'],['b', 'bb', 'bbb'],['c', 'cc', 'ccc']
将上面稍微经行变形
var arr = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]
$.each(arr, function(i, item){
$.each(item,function(j,val){
alert(j);
alert(val);
});
});
alert(j)将输出为0,1,2,0,1,2,0,1,2
alert(val)将输出为a,aa,aaa,b,bb,bbb,c,cc,ccc
each处理json数据,这个each就有更厉害了,能循环每一个属性
var obj = { one:1, two:2, three:3};
each(obj, function(key, val) {
alert(key);
alert(val);
});
这里alert(key)将输出one two three
alert(val)将输出one,1,two,2,three,3
这边为何key不是数字而是属性呢,因为json格式内是一组无序的属性-值,既然无序,又何来数字呢。
而这个val等同于obj[key]
ecah处理dom元素,此处以一个input表单元素作为例子。
如果你dom中有一段这样的代码
<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444"/>
然后你使用each如下
$.each($("input:hidden"), function(i,val){
alert(val);
alert(i);
alert(val.name);
alert(val.value);
});
那么,
alert(val)将输出[object HTMLInputElement],因为它是一个表单元素。
alert(i)将输出为0,1,2,3
alert(val.name);将输出aaa,bbb,ccc,ddd,如果使用this.name将输出同样的结果
alert(val.value); 将输出111,222,333,444,如果使用this.value将输出同样的结果
$().each
这个主要处理dom比较多
<ul>
<li>1</li>
<li>12</li>
<li>123</li>
<li>1234</li>
<li>12345</li>
<li>123456</li>
</ul>
<script type="text/javascript">
console.log($('li'));
$('li').each(function(){
console.log($(this).text());
})
</script>