Jquery 如何遍历json响应?
我有这个json响应,我试着用它来获取天气条件,比如“湿度”和“温度”等等。我尝试了一些方法,但没有成功Jquery 如何遍历json响应?,jquery,json,api,Jquery,Json,Api,我有这个json响应,我试着用它来获取天气条件,比如“湿度”和“温度”等等。我尝试了一些方法,但没有成功 ({ "data" : { "current_condition" : [ { "cloudcover" : "50", "humidity" : "44", "observation_time" : "12:10 AM", "precipMM" : "0.0", "pressure" : "10
({ "data" : { "current_condition" : [ { "cloudcover" : "50",
"humidity" : "44",
"observation_time" : "12:10 AM",
"precipMM" : "0.0",
"pressure" : "1013",
"temp_C" : "-2",
"temp_F" : "29",
"visibility" : "16",
"weatherCode" : "116",
"weatherDesc" : [ { "value" : "Partly Cloudy" } ],
"weatherIconUrl" : [ { "value" : "http://www.worldweatheronline.com/images/wsymbols01_png_64/wsymbol_0004_black_low_cloud.png" } ],
"winddir16Point" : "W",
"winddirDegree" : "280",
"windspeedKmph" : "24",
"windspeedMiles" : "15"
} ],
"request" : [ { "query" : "Rochester, United States Of America",
"type" : "City"
} ],
"weather" : [ { "date" : "2012-02-25",
"precipMM" : "2.2",
"tempMaxC" : "-1",
"tempMaxF" : "31",
"tempMinC" : "-5",
"tempMinF" : "24",
"weatherCode" : "116",
"weatherDesc" : [ { "value" : "Partly Cloudy" } ],
"weatherIconUrl" : [ { "value" : "http://www.worldweatheronline.com/images/wsymbols01_png_64/wsymbol_0002_sunny_intervals.png" } ],
"winddir16Point" : "W",
"winddirDegree" : "281",
"winddirection" : "W",
"windspeedKmph" : "54",
"windspeedMiles" : "34"
} ]
} })
我试过这些:
$.getJSON(urlFromMyAPI, function (data) {
alert(data.current_condition.temp_C);
alert(data.temp_C);
alert(data[current_condition].temp_C);
// I also use loop
for (i = 0; i <= 3; i++) {
alert(data.current_condition[i])
}
});
};
$.getJSON(urlFromMyAPI,函数(数据){
警报(数据、当前状况、温度);
警报(数据温度);
警报(数据[当前状况].temp\u C);
//我也使用循环
对于(i=0;i要循环通过JSON
对象中包含的数组,您需要访问data.data.current\u condition
:
for(i = 0; i <= 3; i++){
alert(data.data.current_condition[i]);
var properties = data.data.current_condition[i];
for(var y in properties)
alert(properties[y]);
}
for(i=0;i您的代码有两个问题
您的变量称为data,JSON中的第一件事是名为data的对象
current_condition是一个对象数组(在Javascript中,方括号[]
指数组,大括号{}
指对象),所以在指临时C之前必须先说current_condition[index]
在本例中,我将data
重命名为json\u data
,以避免混淆:
$.getJSON( urlFromMyAPI, function(json_data){
console.log(json_data.data.current_condition[0].temp_C);
});
如果有多个当前\u条件
对象,可以使用for循环遍历它们:
$.getJSON( urlFromMyAPI, function(json_data){
var current_conditions = json_data.data.current_condition;
for(var i=0; i < current_conditions.length; i++) {
console.log(current_conditions.temp_C);
}
});
$.getJSON(urlFromMyAPI,函数(json_数据){
var current_conditions=json_data.data.current_condition;
对于(var i=0;i<当前_条件.length;i++){
控制台日志(当前条件温度);
}
});
如果您想以更好的格式查看,可以使用Javascript美化器(例如)
您可能会发现console.log
比alert
更有用。大多数浏览器都有一个控制台,在Google Chrome中,您可以通过按F12
并单击console来找到它。我认为您的主要问题是,您的数据嵌套在名为data
的对象中,因此您需要额外的引用级别才能登录ide。当您将响应格式化为这样时,可以更容易地看到您得到了什么,这样您就可以更清楚地看到嵌套的对象和数组:
({ "data": {
"current_condition": [
{
"cloudcover": "50",
"humidity": "44",
"observation_time": "12:10 AM",
"precipMM": "0.0",
"pressure": "1013",
"temp_C": "-2",
"temp_F": "29",
"visibility": "16",
"weatherCode": "116",
"weatherDesc": [
{"value": "Partly Cloudy" }
],
"weatherIconUrl": [
{"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0004_black_low_cloud.png" }
],
"winddir16Point": "W",
"winddirDegree": "280",
"windspeedKmph": "24",
"windspeedMiles": "15"
}
],
"request": [
{"query": "Rochester, United States Of America", "type": "City" }
],
"weather": [
{
"date": "2012-02-25",
"precipMM": "2.2",
"tempMaxC": "-1",
"tempMaxF": "31",
"tempMinC": "-5",
"tempMinF": "24",
"weatherCode": "116",
"weatherDesc": [
{"value": "Partly Cloudy" }
],
"weatherIconUrl": [
{"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png" }
],
"winddir16Point": "W",
"winddirDegree": "281",
"winddirection": "W",
"windspeedKmph": "54",
"windspeedMiles": "34"
}
]
}
})
也就是说,如果您想获得当前条件temp_C
,它将是这样的(注意,我更改了匿名函数的参数名称,以减少代码的混乱):
如果要将临时值作为一个数字,您可能需要执行以下操作:
$.getJSON( urlFromMyAPI, function(response){
var temp = parseInt(response.data.current_condition[0].temp_C, 10);
});
JSON不应包装在“()”中,除非它在打开“(”之前以函数名作为jsonp发送。现在假设您从指向jsonp url的浏览器复制了响应,粘贴的是复制错误
使用$.each可以使循环非常容易
$.each( data.data.current_condition[0], function ( key, value){
console.log( 'Key:', key, ' Value:', value)
})
这些数据是您的数据中的数据,还是您粘贴了什么?不确定我是否了解您的问题,但这些数据是从世界天气在线api返回的。它可以正常工作,伙计。无法给您+1我没有声誉:)@user1233225-在经过适当的时间后,您可以按下您最喜欢的答案旁边的复选标记,将其标记为最佳答案,您也将因此获得一些声誉分数。
$.each( data.data.current_condition[0], function ( key, value){
console.log( 'Key:', key, ' Value:', value)
})