jquery循环遍历json

标签 jquery json

嗨,我正在尝试像这样循环遍历 json 文件:

$.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"
      }
   }
}

问题是如果只有一个播放列表,数据会发生变化,然后我会得到“未定义”

   {
   "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 服务并且它们以该格式返回数据的情况下,这是可以接受的,那么您无能为力

关于jquery循环遍历json,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5212773/

相关文章:

javascript - 多个ajax请求未定义

javascript - 为 PHP 表格单元格中的特定单词添加颜色

json - 在 Flutter 中解析 JSON 日期

java - JSON 序列化对象的日期格式为 2006-10-04T19 :49:49. 无法对其进行反序列化

java - Android:将JSON对象值转换为指定类

javascript - 将转换后的二进制代码保存在浏览器本地存储中

javascript - 带有覆盖和 html 的图库无法覆盖正确的图像。查询

javascript - 自动完成数据库中的多个值

javascript - 通过 Jquery 每个 json 从多维数组中获取特定值

jquery - 无法从带注释的 Controller 获取自动格式化的 json 数据