He creado un código donde puedes console.log()
un elemento de una búsqueda.
Si quiero console.log()
la propiedad lat
de los data
, funciona. Ahora, quiero console.log()
el elemento de propiedad pop
de la API. La propiedad pop
está dentro de la matriz hourly
. Creo (ver url en el código).
Pero hay un problema, no puedo hacer que esto se imprima ni en la consola ni en HTML. ¿Alguien puede ayudarme a console.log()
la propiedad pop
de la búsqueda de API?
<body> <p>De regen percentage is: <br><span id="pop"></span></p> <script> const api_url = 'https://api.openweathermap.org/data/2.5/onecall?lat=52.1092717&lon=5.1809676&&exclude=current,minutely,timezone,alerts&appid=add524720c6b11d0649d761f76e953c8'; async function getRain(){ const response = await fetch(api_url); const data = await response.json(); const {lat} = data; console.log(lat); document.getElementById('pop').textContent = lat; } getRain(); </script> </body>
Aquí se explica cómo acceder a la propiedad pop. La propiedad por hora es una matriz, por lo que debe recorrer la matriz para acceder a cada valor emergente. Si desea acceder a un valor específico, puede filtrar la propiedad por hora para elementos en la matriz que cumplan con su condición.
<body> <p>De regen percentage is: <br><span id="pop"></span></p> <script> const api_url = 'https://api.openweathermap.org/data/2.5/onecall?lat=52.1092717&lon=5.1809676&&exclude=current,minutely,timezone,alerts&appid=add524720c6b11d0649d761f76e953c8'; async function getRain(){ const response = await fetch(api_url); const data = await response.json(); const {lat, hourly} = data; console.log(lat); hourly.forEach(element => { console.log(element.pop); }); document.getElementById('pop').textContent = lat; } getRain(); </script> </body>
Ejemplo filtrado: aquí estoy recorriendo (filtrando) la matriz por hora para elementos donde la temperatura es mayor que 283.
console.log(hourly.filter(a => a.temp > 283))
Si desea imprimir todos los datos emergentes de la API en el elemento HTML como sugiere su comentario, puede hacerlo de la siguiente manera: estoy usando la función de mapa para recorrer la matriz y devolver cada valor emergente.
const popArr = hourly.map(ele => ele.pop); document.getElementById('pop').textContent = popArr;