Cuando ejecuto mi archivo html, no puedo obtener la temperatura de openweather.com
Este es mi archivo html:-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JS Lab: APIs</title> </head> <body> <h1>Retrieving JSON Data from an API</h1> <h2 id="location"></h2> <div id="temperature"></div> <div id="conditions"></div> <div id="icon"></div> </div> <script src="LAB-11-APIs-22.js"></script> > this is my javascript file </body> </html>Este es mi archivo javascript: -
function FetchAPI(city) { let key = '[my_api_key]';esta es mi clave api
let temp ="Celcius"; var URL="http://api.openweathermap.org/data/2.5/weather?q=Toronto,On,Ca&appid=[my_api_key]";la URL que estoy usando para obtener el clima.
let http = new XMLHttpRequest(); xhr.responseType = 'json'; http.onreadystatechange = function () { if (this.readyState === 4 && this.status === 200) { let json = JSON.parse(this.response); // ** EXTRACTING VALUES FROM JSON DATA SET **Dar valor al nombre de la ciudad
document.getElementById('location').innerHTML = json.name;Mostrar icono del tiempo
document.getElementById('icon').src = "http://openweathermap.org/img/w/" + json.weather[0].icon + ".png"; // STRING CONCATENATIONDar valor a la temperatura
document.getElementById('temperature').innerHTML = Math.round(json.main.temp);Dar valor a las condiciones
document.getElementById('conditions').innerHTML = json.weather[0].description; } else { } } http.open("GET", URL, true); http.send(); }Llame a la función. Por ejemplo,
<script src="LAB-11-APIs-22.js"></script> <script>FetchAPI('Toronto')</script> Su primer script solo define una función, pero nunca la invocó después.