Bonjour à tous et désolé pour ma demande, surement l'impatience.
Car après avoir fouillé sur le Net voici la solution que j'utilise pour répondre à mon attente :
<center>
<h1 class="city"></h1>
<img src="" alt="" class="weather-icon">
<h1 class="temp"></h1>
<p class="description"> </p>
<p class="humidity"></p>
<p class="wind"></p>
<p class="pressure"></p>
<!-- <p class="flag"></p>-->
<img src="" alt="Pays" class="urlflag" width="22px" height="15px">
</center>
<script>
(()=>{
let url = 'https://ipgeolocation.abstractapi.com/v1/?api_key=Ma_Clef_API';
fetch(url).then(resp => resp.json()).then(data_ipapi =>{
let apiKey = "Ma_Clef_API";
let apiUrl = "https://api.openweathermap.org/data/2.5/weather?units=metric&lang=fr";
url = `${apiUrl}&appid=${apiKey}&q=${data_ipapi.city}`;
fetch(url).then(resp => resp.json()).then(data =>{
//console.log(data);
document.querySelector(".city").innerHTML = data.name;
document.querySelector(".temp").innerHTML = `${Math.round (data.main.temp)} °c`;
document.querySelector(".description").innerHTML = `Description : ${data.weather[0].description}`;
document.querySelector(".humidity").innerHTML = `Humidité : ${Math.round (data.main.humidity)} %`;
document.querySelector(".wind").innerHTML = `Vent : ${Math.round (data.wind.speed)} km/h`;
document.querySelector(".pressure").innerHTML = `Préssion : ${(data.main.pressure)} hPa`;
document.querySelector(".weather-icon").src = `img/weather/${data.weather[0].main.toLowerCase()}.png`;
/* document.querySelector(".flag").innerHTML = data_ipapi.flag.emoji; */
document.querySelector(".urlflag").src = data_ipapi.flag.png;
});
});
})()
</script>
Merci à tous et j'espére que cela pourra aider qq.
Cordialement.
Daniel.