ork*_*rky 5 api jquery json weather-api
我在使用API创建完整的应用程序时遇到了一些问题,特别是Forecast.io weather api.为简单起见,我将我的JS直接放在我的HTML页面中.对于这个基本版本,我很高兴有这个展示的东西.假设我想要当前的温度(目前 - >温度).另外,我不确定"?回调?" 始终建议所有RESTful API使用.
<!DOCTYPE html>
<html>
<body>
<p id="weather">Here's the weather:<p>
<button onclick="b()">Submit</button>
<script>
function b(){
var apiKey = '<private>';
var url = 'https://api.forecast.io/forecast/';
var lati = 0;
var longi = 0;
var data;
$.getJSON(url + apiKey + "/" + lati + "," + longi + "?callback=?", function(data) {
$('#weather').innerHTML('and the weather is: ' + data[4].temperature);
});
}
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
您犯的主要错误不包括jQuery :-)下一个是在jQuery对象上,您需要使用html()函数而不是JavaScript本机innerHTML属性.
如果使用console.log(数据),则可以看到返回对象的所有属性,因此可以像data.currently.temperature一样正确引用它.
<!DOCTYPE html>
<html>
<body>
<p id="weather">Here's the weather:<p>
<button onclick="b()">Submit</button>
<script>
function b(){
var apiKey = '<PRIVATE>';
var url = 'https://api.forecast.io/forecast/';
var lati = 0;
var longi = 0;
var data;
$.getJSON(url + apiKey + "/" + lati + "," + longi + "?callback=?", function(data) {
//console.log(data);
$('#weather').html('and the temperature is: ' + data.currently.temperature);
});
}
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)