使用 jQuery 在 DIV 中显示 JSON 对象
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11315407/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Display JSON object in DIV using jQuery
提问by Kris Hollenbeck
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.
谁能告诉我我在这里做错了什么？我正在使用 ESPN API 检索 JSON 对象，但是我无法使其显示在我的 HTML 页面上的 DIV 中。
My jQuery
我的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.');
}
});
My Returned JSON
我返回的 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"
}
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.
该请求工作正常，一切正常。我就是不知道如何让数据出现在我的 HTML 页面上。我以为我可以只使用该.html()属性，但我一定遗漏了一些东西。
Thanks for your help..
谢谢你的帮助..
回答by jamcoupe
Here is a jsfiddle.
这是一个jsfiddle。
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:
查看我获取 JSON 的 JavaScript 底部。然后我使用点表示法遍历对象并获取我需要的信息并输出它：
data.sports[0].leagues[0].teams[0].links.apithis is the sort of thing you will need to do
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 />');
}
});
the [0]is used because you have used arrays in your JSON.
[0]之所以使用，是因为您在 JSON 中使用了数组。
回答by jamcoupe
Wrap the json in a <pre></pre>block and then output that onto the page
将 json 包装在一个<pre></pre>块中，然后将其输出到页面上
回答by raja
data.sports[0].leagues[0].teams[0].links.api
data.sports[0].leagues[0].teams[0].links.api
this is the sort of thing you will need to do
这是你需要做的事情
$.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 />');
}
}
