jQuery元素遍历方法jQuery.each()

jQuery元素遍历方法jQuery.each()

2014-07-18 21:02:03|?次阅读|上传:wustguangh【已有?条评论】发表评论

关键词:JavaScript, JQuery|来源:唯设编程网

jQuery.each ()方法是一个通用的遍历方法,可用于遍历对象和数组。不同于遍历 jQuery 对象的 $().each() 方法,此方法可用于遍历任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。

使用each方法能使方便地遍历DOM元素,并且不容易出错。jQuery.each ()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组、多维数组、DOM, JSON 等等。在实际jQuery开发过程中使用$.each可以大大的减轻我们的工作量。

下面总结一下jQuery.each的几种常用的用法 

1.使用each处理一维数组

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

function函数的i表示元素在数组中的序号,val表示元素对应的值。

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

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

2.使用each处理二维数组 

  var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]     
  $.each(arr, function(i, item){     
      alert(i);  
      alert(item);     
  }); 

arr2为一个二维数组,i是二维数组内部的一位数组元素对应的序号,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

<123>
发表评论0条 】
网友评论(共?条评论)..
jQuery元素遍历方法jQuery.each()