jQuery通过JSON循环 [英] jquery loop through json

问题描述

我正在尝试遍历json文件，如下所示:

Hi I am trying to loop through a json file like so:

$.each(data.playlists.playlist, function(i, item) {

              $("#contentC").append('<p>' + item.id + '</p>'); 
              $("#contentC").append('<p>' + item.title + '</p>'); 
              $("#contentC").append('<p>' + item.url + '</p>'); }
           ); 

json:

{
   "playlists":{
      "playlist":[
         {
            "id":"8391802",
            "title":"Second Playlist",
            "description":"",
            "date":"2011-03-06T18:53:33",
            "size":"10",
            "duration":"2267",
            "streamable":"0",
            "creator":"http:\/\/www.last.fm\/user\/jon21021985",
            "url":"http:\/\/www.last.fm\/user\/jon21021985\/library\/playlists\/4zv5m_second_playlist",
            "image":[
               {
                  "#text":"",
                  "size":"small"
               },
               {
                  "#text":"",
                  "size":"medium"
               },
               {
                  "#text":"",
                  "size":"large"
               },
               {
                  "#text":"",
                  "size":"extralarge"
               }
            ]
         },
         {
            "id":"8372409",
            "title":"All-american Rejects",
            "description":"",
            "date":"2011-02-28T13:30:01",
            "size":"6",
            "duration":"785",
            "streamable":"0",
            "creator":"http:\/\/www.last.fm\/user\/jon21021985",
            "url":"http:\/\/www.last.fm\/user\/jon21021985\/library\/playlists\/4zg6x_all-american_rejects",
            "image":[
               {
                  "#text":"",
                  "size":"small"
               },
               {
                  "#text":"",
                  "size":"medium"
               },
               {
                  "#text":"",
                  "size":"large"
               },
               {
                  "#text":"",
                  "size":"extralarge"
               }
            ]
         }
      ],
      "@attr":{
         "user":"jon21021985"
      }
   }
}

问题在于，如果只有一个播放列表，那么数据会发生变化，然后我会得到未定义"

the problem is the data changes if there is only one playlist then I get 'undefined'

   {
   "playlists":{
      "playlist":{
         "id":"1319510",
         "title":"Untitled",
         "description":"",
         "date":"2007-10-18T12:17:58",
         "size":"1",
         "duration":"345",
         "streamable":"0",
         "creator":"http:\/\/www.last.fm\/user\/john",
         "url":"http:\/\/www.last.fm\/user\/john\/library\/playlists\/sa52_",
         "image":[
            {
               "#text":"",
               "size":"small"
            },
            {
               "#text":"",
               "size":"medium"
            },
            {
               "#text":"",
               "size":"large"
            },
            {
               "#text":"",
               "size":"extralarge"
            }
         ]
      },
      "@attr":{
         "user":"john"
      }
   }
}

推荐答案

if($.isArray(data.playlists.playlist))
{
             $.each(data.playlists.playlist, function(i, item) {
               displayPlayList(item)
           ); 
}
else
{
      displayPlayList(data.playlists.playlist);
}


    //this way of appending an element is very poor coding practice but 
    //i have done  this way, because u yourself have written this
    // if u want then i can suggest you, how can u optimize this code
    function displayPlayList(item)
    {
                  $("#contentC").append('<p>' + item.id + '</p>'); 
                  $("#contentC").append('<p>' + item.title + '</p>'); 
                  $("#contentC").append('<p>' + item.url + '</p>'); }

    }

修改

正如Emmet指出的那样，您应该始终返回数组.但是在您使用该方json服务并且它们以该格式返回数据的情况下，这是可以接受的，那么您无能为力

As Emmet has pointed out you should always return array. But its acceptable in scenarios where you are using that party json services and they are returning data in that format, then there is nothing you can do

这篇关于jQuery通过JSON循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！