script.js

const apikey = "19f1642e11d962c9c16fc915a8233d5b";
const apiurl = "https://api.openweathermap.org/data/2.5/weather?units=metric&q=";

const searchbox = document.querySelector(".search input");
const searchBtn = document.querySelector(".search button");
const weathericon = document.querySelector(".weather-icon");

async function checkweather(city){
    const response = await fetch(`${apiurl}${city}&appid=${apikey}`);
    var data = await response.json();
    console.log(data.weather[0].main);

    document.querySelector(".city").innerHTML = data.name;
    document.querySelector(".temp").innerHTML =  Math.round(data.main.temp) + "°C";
    document.querySelector(".humidity").innerHTML = data.main.humidity + "%";
    document.querySelector(".wind").innerHTML = data.wind.speed +"km/h";

if(data.weather[0].main == "Clouds"){
    weathericon.src="images/clouds.png";
}
else if(data.weather[0].main =="Rain"){
    weathericon.src ="images/rain.jpeg";
}
else if (data.weather[0].main=="Drizzle"){
    weathericon.src="images/drizzlers.jpg";
}
else if(data.weather[0].main=="Mist"){
weathericon.src="images/mist.jpeg";
}
document.querySelector(".weather").style.display =" block";

}
searchBtn.addEventListener("click",()=>{
checkweather(searchbox.value);
})