使用jQuery在DIV中显示JSON对象 [英] Display JSON object in DIV using jQuery

问题描述

有人可以告诉我我在做什么错吗?我正在使用ESPN API检索JSON对象，但是无法使其显示在HTML页面的DIV中.

Can anybody tell me what I am doing wrong here? I am retrieving a JSON object using ESPN API, however I am unable to make it display in a DIV on my HTML page.

我的jQuery

$.ajax({
    type: "GET",
    dataType: "json",
    data: " ",
    url: 'http://api.espn.com/v1/sports/basketball/nba/teams/16?enable=stats,leaders&seasontype=2&_accept=text/json&apikey=XXXXX2457896',
    success: function(data) {
      $('#result').html(data);
      console.log('Load was performed.');
    }
});

我返回的JSON

{
  "sports": [
    {
      "name": "basketball",
      "id": 40,
      "leagues": [
        {
          "id": 46,
          "groupId": 7,
          "name": "National Basketball Assoc.",
          "abbreviation": "NBA",
          "teams": [
            {
              "id": 16,
              "location": "Minnesota",
              "name": "Timberwolves",
              "abbreviation": "MIN",
              "color": "0E3764",
              "links": {
                "api": {
                  "teams": {
                    "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16"
                  },
                  "news": {
                    "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16/news"
                  },
                  "notes": {
                    "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16/news/notes"
                  }
                },
                "web": {
                  "teams": {
                    "href": "http://espn.go.com/nba/team/_/name/min/minnesota-timberwolves?ex_cid=espnapi_public"
                  }
                },
                "mobile": {
                  "teams": {
                    "href": "http://m.espn.go.com/nba/clubhouse?teamId=16&ex_cid=espnapi_public"
                  }
                }
              }
            }
          ]
        }
      ]
    }
  ],
  "resultsOffset": 0,
  "resultsLimit": 50,
  "resultsCount": 1,
  "timestamp": "2012-07-03T16:33:07Z",
  "status": "success"
}

该请求正常运行，并且一切正常.我只是想不通如何使数据显示在HTML页面上.我以为可以使用.html()属性，但是我肯定缺少一些东西.

The request works fine and everything. I just can't figure out how to get the data to appear on my HTML page.I thought I could just use the .html() property, but I must be missing something.

感谢您的帮助.

推荐答案

这里是 jsfiddle .

查看获得JSON的JavaScript底部.然后，我使用点符号来遍历对象并获取所需的信息并将其输出:

Look at the bottom of the JavaScript where I get the JSON. Then I use dot notation to traverse the object and get the information I need and output it:

data.sports[0].leagues[0].teams[0].links.api这是您需要做的事情

$.getJSON('/sports', function(data) {

    var links = data.sports[0].leagues[0].teams[0].links.api

    for(var key in links) {

        $('body').append('<a href="'+ links[key].href +'">'+ links[key].href +'</a><br />');          

    }                 

});

使用[0]是因为您在JSON中使用了数组.

the [0] is used because you have used arrays in your JSON.

这篇关于使用jQuery在DIV中显示JSON对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！