使用jQuery獲取JSON數據

Question

我有一個顯示如下的JSON響應：

{
  "gameId": 2540832082,
  "mapId": 12,
  "gameMode": "ARAM",
  "gameType": "MATCHED_GAME",
  "gameQueueConfigId": 65,
  "participants": [
    {
      "teamId": 100,
      "spell1Id": 32,
      "spell2Id": 7,
      "championId": 25,
      "profileIconId": 774,
      "summonerName": "MLG Elan",
      "bot": false,
      "summonerId": 77477471,
      "runes": [],
      "masteries": [
        {
          "rank": 5,
          "masteryId": 6111
        },
        {
          "rank": 1,
          "masteryId": 6122
        },
        {
          "rank": 2,
          "masteryId": 6131
        }
      ]
    },
    {
      "teamId": 100,
      "spell1Id": 4,
      "spell2Id": 32,
      "championId": 120,
      "profileIconId": 774,
      "summonerName": "Nuetzlich",
      "bot": false,
      "summonerId": 43800105,
      "runes": [
        {
          "count": 6,
          "runeId": 5245
        },
        {
          "count": 2,
          "runeId": 5335
        }
      ],
      "masteries": [
        {
          "rank": 3,
          "masteryId": 6114
        },
        {
          "rank": 5,
          "masteryId": 6312
        },
        {
          "rank": 1,
          "masteryId": 6322
        },
        {
          "rank": 5,
          "masteryId": 6331
        },
        {
          "rank": 1,
          "masteryId": 6343
        },
        {
          "rank": 5,
          "masteryId": 6351
        },
        {
          "rank": 1,
          "masteryId": 6362
        }
      ]
    },
    {
      "teamId": 100,
      "spell1Id": 13,
      "spell2Id": 7,
      "championId": 67,
      "profileIconId": 19,
      "summonerName": "Sonicmońgrel",
      "bot": false,
      "summonerId": 82267777,
      "runes": [
        {
          "count": 6,
          "runeId": 5245
        },
        {
          "count": 2,
          "runeId": 5335
        }
      ],
      "masteries": [
        {
          "rank": 5,
          "masteryId": 6312
        },
        {
          "rank": 1,
          "masteryId": 6323
        },
        {
          "rank": 5,
          "masteryId": 6331
        },
        {
          "rank": 1,
          "masteryId": 6343
        },
        {
          "rank": 4,
          "masteryId": 6351
        }
      ]
    },

我正在努力獲取每個玩家的“ summonerNames”並將其顯示在網站上：(

我需要什么jQuery？

這就是獲取數據的方式：

function getCurrentGame(summonerID) {
    $.ajax({
        url: "https://euw.api.pvp.net/observer-mode/rest/consumer/getSpectatorGameInfo/EUW1/" + summonerID + "?api_key=" + APIKEY,
        type: 'GET',
        dataType: 'json',
        data: {
        },

我在這里需要什么：

    success: function (resp) {


      }

要顯示召喚者的名字？

我在HTML中有此功能，可以根據名稱簡單地建立列表：

Current Players (<span id="listPlayers"></span>)
<hr />
<span id="playerNames"></span>

隨意修改它，我真的不知道如何列出玩家的名字:(

謝謝！！！

Answer 1

您的整個JSON對象就是resp。

假設您要訪問"gameMode": "ARAM" ，它將是resp.gameMode 。
讓我們想訪問"summonerName": "MLG Elan" ，它將是resp.participants.summonerName （因為resp.participants.summonerName在稱為參與者的數組中）

Answer 2

嘗試這個

var obj = jQuery.parseJSON( resp );
alert( obj.participants[0].summonerName);

Answer 3

在您的json data.participants是一個數組，您可以使用Array#map獲取所有名稱：

var names = data.participants.map(function(item) {
     return item.summonerName;    
});

你不需要jquery的

Answer 4

JSON格式

var json = yourJSON;

的JavaScript

var lenght = json.participants.length;
var summonerName = "";
for (i = 0; i < lenght ; i++){
  summonerName += json.participants[i].summonerName.toString() + ", ";
}
document.getElementById("playerNames").innerText = summonerName;

的HTML

<span id="playerNames"></span>

Answer 5

resp參數是由返回的Json創建的JavaScript對象。 summonerName是每個參與者的屬性，而參與者是對象的數組。 因此，您需要遍歷參與者數組並獲取每個參與者的名稱。 試試這個

  success: function (resp) {
    var participants = resp.participants,
        names = "",
        spanElement = document.getElementById("playerNames");

     participants.forEach(function(part){
       names = names + part.summonerName + " ";
     }

     spanElement.innerText = names ;
  }