尝试解析 Yahoo Weather JSON 时出错

Question

我正在编写我的第一个简单的 HTML 和 JavaScript/JQuery 页面，该页面连接到 Yahoo Weather API (https://developer.yahoo.com/weather/)。

到目前为止，我已经能够在 JQuery 中处理 JSON 响应并使用以下内容更新我的 HTML 内容：

$('#text').html("Weather is: " + data.query.results.channel.item.condition.text);

到目前为止，一切都很好！

但是，在尝试使用此 JavaScript 解析以下 JSON 时，我收到“SyntaxError: missing ) after argument list”错误：

$('#day0day').html(data.query.results.channel.item.forecast.0.day);

我认为错误是由上面的“0”引起的，但我们将不胜感激。

Answer 1

forecast 是一个数组，因此您需要使用索引才能访问其中的值。

$('#day0day').html(data.query.results.channel.item.forecast[0].day);

var data = {"query":{"count":1,"created":"2018-03-06T21:06:04Z","lang":"pt-BR","results":{"channel":{"units":{"distance":"km","pressure":"mb","speed":"km/h","temperature":"C"},"title":"Yahoo! Weather - London, England, GB","link":"http://us.rd.yahoo.com/dailynews/rss/weather/Country__Country/*https://weather.yahoo.com/country/state/city-44418/","description":"Yahoo! Weather for London, England, GB","language":"en-us","lastBuildDate":"Tue, 06 Mar 2018 09:06 PM GMT","ttl":"60","location":{"city":"London","country":"United Kingdom","region":" England"},"wind":{"chill":"45","direction":"180","speed":"11.27"},"atmosphere":{"humidity":"67","pressure":"33423.67","rising":"0","visibility":"25.91"},"astronomy":{"sunrise":"6:36 am","sunset":"5:49 pm"},"image":{"title":"Yahoo! Weather","width":"142","height":"18","link":"http://weather.yahoo.com","url":"http://l.yimg.com/a/i/brand/purplelogo//uh/us/news-wea.gif"},"item":{"title":"Conditions for London, England, GB at 08:00 PM GMT","lat":"51.506401","long":"-0.12721","link":"http://us.rd.yahoo.com/dailynews/rss/weather/Country__Country/*https://weather.yahoo.com/country/state/city-44418/","pubDate":"Tue, 06 Mar 2018 08:00 PM GMT","condition":{"code":"26","date":"Tue, 06 Mar 2018 08:00 PM GMT","temp":"7","text":"Cloudy"},"forecast":[{"code":"39","date":"06 Mar 2018","day":"Tue","high":"10","low":"6","text":"Scattered Showers"},{"code":"28","date":"07 Mar 2018","day":"Wed","high":"9","low":"2","text":"Mostly Cloudy"},{"code":"30","date":"08 Mar 2018","day":"Thu","high":"8","low":"2","text":"Partly Cloudy"},{"code":"11","date":"09 Mar 2018","day":"Fri","high":"9","low":"1","text":"Showers"},{"code":"39","date":"10 Mar 2018","day":"Sat","high":"11","low":"8","text":"Scattered Showers"},{"code":"28","date":"11 Mar 2018","day":"Sun","high":"11","low":"6","text":"Mostly Cloudy"},{"code":"12","date":"12 Mar 2018","day":"Mon","high":"9","low":"6","text":"Rain"},{"code":"12","date":"13 Mar 2018","day":"Tue","high":"8","low":"4","text":"Rain"},{"code":"28","date":"14 Mar 2018","day":"Wed","high":"9","low":"4","text":"Mostly Cloudy"},{"code":"12","date":"15 Mar 2018","day":"Thu","high":"9","low":"5","text":"Rain"}],"description":"<![CDATA[<img src=\"http://l.yimg.com/a/i/us/we/52/26.gif\"/>\n<BR />\n<b>Current Conditions:</b>\n<BR />Cloudy\n<BR />\n<BR />\n<b>Forecast:</b>\n<BR /> Tue - Scattered Showers. High: 10Low: 6\n<BR /> Wed - Mostly Cloudy. High: 9Low: 2\n<BR /> Thu - Partly Cloudy. High: 8Low: 2\n<BR /> Fri - Showers. High: 9Low: 1\n<BR /> Sat - Scattered Showers. High: 11Low: 8\n<BR />\n<BR />\n<a href=\"http://us.rd.yahoo.com/dailynews/rss/weather/Country__Country/*https://weather.yahoo.com/country/state/city-44418/\">Full Forecast at Yahoo! Weather</a>\n<BR />\n<BR />\n<BR />\n]]>","guid":{"isPermaLink":"false"}}}}}}

console.log(data.query.results.channel.item.forecast[0].day); //This is your approach!
data.query.results.channel.item.forecast.forEach(f => $('#day0day').html($('#day0day').html() + ' - ' + f.day));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="day0day"></span>