Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解
一、Jquery遍历筛选数组
1、jquery grep()筛选遍历数组
$().ready( function(){ var array = [1,2,3,4,5,6,7,8,9]; var filterarray = $.grep(array,function(value){ return value > 5;//筛选出大于5的 }); for(var i=0;i<filterarray.length;i++){ alert(filterarray[i]); } for (key in filterarray){ alert(filterarray[key]); } } );
2、jquery each()筛选遍历数组
$().ready( function(){ var anObject = {one:1,two:2,three:3};//对json数组each $.each(anObject,function(name,value) { alert(name); alert(value); }); var anArray = ['one','two','three']; $.each(anArray,function(n,value){ alert(n); alert(value); } ); } );
3、jquery inArray()筛选遍历数组
$().ready( function(){ var anArray = ['one','two','three']; var index = $.inArray(‘two’,anArray); alert(index);//返回该值在数组中的键值,返回1 alert(anArray[index]);//value is two } );
4、jquery map()筛选遍历数组
$().ready( function(){ var strings = ['0','1','2','3','4','S','6']; var values = $.map(strings,function(value){ var result = new Number(value); return isNaN(result) ? null:result;//isNaN:is Not a Number的缩写 } ); for (key in values) { alert(values[key]); } } );
二、遍历解析json对象
var json = [{dd:'SB',AA:'东东',re1:123},{cccc:'dd',lk:'1qw'}]; for(var i=0,l=json.length;i<l;i++){ for(var key in json[i]){ alert(key+’:'+json[i][key]); } }
2、jquery遍历解析json对象2
有如下 json对象:
var obj ={”name”:”冯娟”,”password”:”123456″,”department”:”技术部”,”sex”:” 女”,”old”:30};
遍历方法:
for(var p in obj){ str = str+obj[p]+’,’; return str; }
三、Map()方法详解
1、实例
构建表单中所有值的列表:
$("p").append( $("input").map(function(){ return $(this).val(); }).get().join(", ") );
2、定义和用法
map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。
3语法
.map(callback(index,domElement))
参数
描述
callback(index,domElement)
对当前集合中的每个元素调用的函数对象。
详细说明
由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组。
.map() 方法对于获得或设置元素集的值特别有用。请思考下面这个带有一系列复选框的表单:
<form method="post" action=""> <fieldset> <div> <label for="two">2</label> <input type="checkbox" value="2" id="two" name="number[]"> </div> <div> <label for="four">4</label> <input type="checkbox" value="4" id="four" name="number[]"> </div> <div> <label for="six">6</label> <input type="checkbox" value="6" id="six" name="number[]"> </div> <div> <label for="eight">8</label> <input type="checkbox" value="8" id="eight" name="number[]"> </div> </fieldset> </form>
我们能够获得复选框 ID 组成的逗号分隔的列表:
$(':checkbox').map(function() { return this.id; }).get().join(',');
本次调用的结果是字符串:"two,four,six,eight"。
在 callback 函数内部,this 引用每次迭代的当前 DOM 元素。该函数可返回单独的数据项,或者是要被插入结果集中的数据项的数组。如果返回的是数组,数组内的元素会被插入集合中。如果函数返回 null 或 undefined,则不会插入任何元素。