700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > js遍历json对象和jquery $.each()遍历json

js遍历json对象和jquery $.each()遍历json

时间:2022-04-19 13:15:19

相关推荐

js遍历json对象和jquery $.each()遍历json

无规律:

<script>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]);}}</script>

有规律(json数组):

packJson = [{"name":"nikita", "password":"1111"},{"name":"tony", "password":"2222"}];for(var p in packJson){//遍历json数组时,这么写p为索引,0,1alert(packJson[p].name + " " + packJson[p].password);}

也可以用这个:

for(var i = 0; i < packJson.length; i++){alert(packJson[i].name + " " + packJson[i].password);}

遍历json对象:

myJson = {"name":"caibaojian", "password":"1111"};for(var p in myJson){//遍历json对象的每个key/value对,p为keyalert(p + " " + myJson[p]);}

有如下 json对象:

var obj ={“name”:“冯娟”,“password”:“123456”,“department”:“技术部”,“sex”:“女”,“old”:30};

遍历方法:

for(var p in obj){str = str+obj[p]+',';return str;}

=========================================================

jquery $.each()遍历json数组

使用jQuery的$.each()方法来遍历一个数组对象

var json=[{"id":"1","tagName":"apple"},{"id":"2","tagName":"banana"},{"id":"3","tagName":"orange"},{"id":"4","tagName":"watermelon"},{"id":"5","tagName":"pineapple"}];$.each(json,function(idx,obj){alert(obj.tagName);});

结果:

但是如果声明的是一个json字符串(用单引号或双引号),那么不能直接用上面的方法遍历,否则会报错:

var json='[{"id":"1","tagName":"apple"},{"id":"2","tagName":"banana"},{"id":"3","tagName":"orange"},{"id":"4","tagName":"watermelon"},{"id":"5","tagName":"pineapple"}]';$.each(json,function(idx,obj){alert(obj.tagNmae);});

所以如果声明的是字符串,那么便遍历的时候应该先用json.parse()或者jquery的方法$.parseJSON将字符串转化为JavaScript对象

$.each(JSON.parse(json),function(idx,obj){alert(obj.tagNmae);});

或者

$.each(JSON.parse(json),function(idx,obj){alert(obj.tagNmae);});

还有一种如下:

// var data = [{"id":1,"name":"北京"},{"id":2,"name":"上海"},{"id":3,"name":"广州"},{"id":4,"name":"陕西"}]//1.获取selectvar province = $("#province");//2.遍历json数组$(data).each(function () {//3.创建<option>var option = "<option name='"+this.id+"'>"+this.name+"</option>"//4.调用select的append追加optionprovince.append(option);<select id="province"><option>--请选择省份--</option></select>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。