2016-02-12 112 views
1

我有一些JavaScript和jQuery和ajax的知识我正在做一个应用程序,它将有多个用户,它有一个复杂的json。 我们如何通过getJSON来解析它,并用html解析它。我想用户A B C的细节,如它的图像路径和所有我们如何可以访问嵌套json抓取

{ 
    "datas": { 
     "show_dashboard_access_page": false, 
     "login_status": "signedin", 
     "new_io": true, 
     "bst_users": [{ 
      "userA": { 
       "user_logo": "image path", 
       "partner_since": "Jan 2013", 
       "status_now": "bronze", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 123000, 
       "storage_wise_usage": 73000, 
       "server_wise_usage": 50000, 
       "order": 1 
      }, 
      "userB": { 
       "user_logo": "image path", 
       "partner_since": "Feb 2014", 
       "status_now": "silver", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 160000, 
       "storage_wise_usage": 60000, 
       "server_wise_usage": 100000, 
       "order": 2 
      }, 
      "userC": { 
       "user_logo": "image path", 
       "partner_since": "Mar 2014", 
       "status_now": "silver", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 180000, 
       "storage_wise_usage": 80000, 
       "server_wise_usage": 100000, 
       "order": 3 
      } 
      }] 
    }, 
    "success": true 
} 


code that i have tried: 
$.getJSON("dummy.json", function(response) { 
    //console.log(response.data.bst_users) 
    $.each(response.data.bst_users , function(key,val){ 
    console.log(key) 
    var item = "<li> <img src='" + val["user_logo"] + "' alt=''/>" + "</li>"; 
    $('ul').append(item) 
}) 
}); 

plz帮助

回答

2

bst_users是这是一个对象的单个元素的数组。所以你需要遍历bst_users[0]中的属性。

$.each(response.datas.bst_users[0], function(key,val){ 
    ... 
} 
+0

但我怎么能遍历每个用户对象 – Deepak

+1

那就是'$ .each'一样。 – Barmar

0

你可以使用jQuery来渲染结果。

var data = { 
 
    "datas": { 
 
     "show_dashboard_access_page": false, 
 
     "login_status": "signedin", 
 
     "new_io": true, 
 
     "bst_users": [{ 
 
      "userA": { 
 
       "user_logo": "image path", 
 
       "partner_since": "Jan 2013", 
 
       "status_now": "bronze", 
 
       "year_calculated": 2016, 
 
       "total": 300000, 
 
       "year_wise_usage": 123000, 
 
       "storage_wise_usage": 73000, 
 
       "server_wise_usage": 50000, 
 
       "order": 1 
 
      }, 
 
      "userB": { 
 
       "user_logo": "image path", 
 
       "partner_since": "Feb 2014", 
 
       "status_now": "silver", 
 
       "year_calculated": 2016, 
 
       "total": 300000, 
 
       "year_wise_usage": 160000, 
 
       "storage_wise_usage": 60000, 
 
       "server_wise_usage": 100000, 
 
       "order": 2 
 
      }, 
 
      "userC": { 
 
       "user_logo": "image path", 
 
       "partner_since": "Mar 2014", 
 
       "status_now": "silver", 
 
       "year_calculated": 2016, 
 
       "total": 300000, 
 
       "year_wise_usage": 180000, 
 
       "storage_wise_usage": 80000, 
 
       "server_wise_usage": 100000, 
 
       "order": 3 
 
      } 
 
      }] 
 
    }, 
 
    "success": true 
 
}; 
 

 
var dataToRender = data.datas.bst_users; 
 

 
$.each(dataToRender[0],function(k,v){ 
 

 
    console.log("Result : " + k); 
 
    
 
    $.each(v,function(key,val){ 
 
    console.log(key + " : " + val); 
 
    }); 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>