jQuery中的each()详细介绍(推荐)

jQuery中的each()详细介绍(推荐)

each()方法能使DOM循环结构简洁,不容易出错。each()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组、多维数组、DOM, JSON 等等

在javaScript开发过程中使用$each可以大大的减轻我们的工作量。

下面提一下each的几种常用的用法

each处理一维数组

var arr1 = [ “aaa”, “bbb”, “ccc” ];
$.each(arr1, function(i,val){
alert(i);
alert(val);
});

alert(i)将输出0,1,2

alert(val)将输出aaa,bbb,ccc

each处理二维数组

  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中有一段这样的代码

© 版权声明

相关文章

暂无评论

none
暂无评论...