javascript - jQueryを使用してJavaScriptでJSONを解析する

Question

この上で髪を伸ばしています。jQuery.getJSON() メソッドを使用してサーバーからの応答を取得しています。これは応答の例です。

{
  "playlist": {
      "track": {
          "song": "Wake me up",
          "albumart": "http://example.com/image.png",
          "videoid": "CDsKBof4iMA"
      }
  }
}

応答には複数のトラックがありますが、プレイリストは 1 つだけです。私は以下を使用してこれを要求しています:

$.getJSON("api/playlist/get.php", {artist: "artist+name" })

このデータを解析するにはどうすればよいですか?

Answer 1

JSON の結果が次のようになったとします。

{

    "playlist": {
        "track": {
            "song": "Wake me up",
            "albumart": "http://example.com/image.png",
            "videoid": "CDsKBof4iMA"
        },
        "track": {
            "song": "Wake me up 2",
            "albumart": "http://example.com/image2.png",
            "videoid": "CDsKBof4iMA2"
        },
        "track": {
            "song": "Wake me up 3",
            "albumart": "http://example.com/image3.png",
            "videoid": "CDsKBof4iMA3"
        }
    }
}

アップデート：

この json は無効な形式です。同じプロパティ名を持つ複数のサブオブジェクトがあるためです。可能であれば、サーバーからの応答を次の形式に変更します。

{
    playlist: {
        tracks: [{
            "song": "Wake me up",
            "albumart": "http://example.com/image.png",
            "videoid": "CDsKBof4iMA"
        }, {
            "song": "Wake me up 2",
            "albumart": "http://example.com/image2.png",
            "videoid": "CDsKBof4iMA2"
        }, {
            "song": "Wake me up 3",
            "albumart": "http://example.com/image3.png",
            "videoid": "CDsKBof4iMA3"
        }]
    }
}

track次に、渡された配列から各オブジェクトを取得できます。

$.getJSON次のような関数を使用する必要があります。

$.getJSON("api/playlist/get.php", function (data) {

    for (var key in myObj.playlist.tracks) {
        //do something with your track object
        console.log(myObj.playlist.tracks[key].song)
    }

})

ここにあなたのためのJsFiddleがあります：http://jsfiddle.net/zur4ik/Fy6ud/1/

Answer 2

$.parseJSON()JSON の JavaScript オブジェクトを取得するために 使用します。http://api.jquery.com/jQuery.parseJSON/

Answer 3

これを試して：

$.getJSON("api/playlist/get.php", function(data) {
    var responseObject = JSON.parse(data);
    // do stuff with responseObject
});

Answer 4

ドキュメントに従って、

 jQuery.getJSON( url [, data ] [, success( data, textStatus, jqXHR ) ] )

ここでsuccess( data, textStatus, jqXHR )は、JSON の読み込みが成功した場合のコールバックです。