码迷,mamicode.com
首页 > 编程语言 > 详细

$.each遍历json数组

时间:2018-04-04 21:20:43      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:func   AC   col   function   app   water   asc   log   pos   

1.遍历单层json数组

我们把idx和obj都打印出来看看,到底是什么东西

var json1 =[{"id":"1","tagName":"apple"},
    {"id":"2","tagName":"orange"},
    {"id":"3","tagName":"banana"},
    {"id":"4","tagName":"watermelon"},
    {"id":"5","tagName":"pineapple"}
];

 
$.each(json1, function(idx, obj) {
    console.log(idx);
    console.log(obj);
    console.log(obj.tagName);
});

控制台截图

技术分享图片

 

我们能看到,idx是索引,obj是对象,tagName可以通过obj直接拿到

 

2.遍历二层(多层)json

var json2 = {"list":[
    {"id":"1","tagName":"apple"},
    {"id":"2","tagName":"orange"},
    {"id":"3","tagName":"banana"},
    {"id":"4","tagName":"watermelon"},
    {"id":"5","tagName":"pineapple"}
],"total":5};
 
$.each(json2,function(index,element){
    console.log("index:"+index);
    console.log("element:"+element);
    $.each(element,function(name,value){
        console.log("name:"+name);
        console.log("value:"+value);
        console.log("value.tagName:"+value.tagName);
    })
});

 

在这里我们用多层嵌套来实现,而不能用单层循环,通过element.list[i].tagName,element.list[0].tagName等等,任何尝试都是徒劳的

必须要从Object里面拿,xx.xx格式才是正确,xx.xx.xx或者xx.xx.xx.xx,当然JavaScript的for循环却可以这么取数据。

接下来我们看看打印出来什么东西

技术分享图片

很清晰的看出,index打印出了外层的list和total,即为索引;element打印出list的五个对象,所以无法单层拿出tagName,最后一个element打印出了total的值

name是对象的索引,内层把value循环遍历出来,我们能看到一个对象,总共五个,然后通过这一个对象拿出其tagName的值

 3.补充

 JavaScript的for遍历二层json

for (var i=0;i<json2.list.length;i++){
        alert(i + json2.list[i].tagName); 
}

个人感觉,原生的简洁易懂

$.each遍历json数组

标签:func   AC   col   function   app   water   asc   log   pos   

原文地址:https://www.cnblogs.com/Java-Starter/p/8718626.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!