新聞中心
要獲取天氣信息,可以使用HTML和JavaScript結(jié)合的方式,你需要找到一個提供天氣數(shù)據(jù)的API,例如OpenWeatherMap、Weather API等,使用JavaScript發(fā)起請求并處理返回的數(shù)據(jù),將數(shù)據(jù)顯示在HTML頁面上。

創(chuàng)新互聯(lián)專注于興慶網(wǎng)站建設(shè)服務(wù)及定制,我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供興慶營銷型網(wǎng)站建設(shè),興慶網(wǎng)站制作、興慶網(wǎng)頁設(shè)計、興慶網(wǎng)站官網(wǎng)定制、微信平臺小程序開發(fā)服務(wù),打造興慶網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供興慶網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。
以下是一個簡單的示例:
1、注冊一個免費賬戶并獲取API密鑰(以O(shè)penWeatherMap為例):https://openweathermap.org/appid
2、創(chuàng)建一個HTML文件,如weather.html,并添加以下內(nèi)容:
天氣查詢
實時天氣查詢
| 城市 | 溫度 | 天氣描述 |
|---|---|---|
3、創(chuàng)建一個JavaScript文件,如weather.js,并添加以下內(nèi)容:
const apiKey = '你的API密鑰'; // 替換為你的API密鑰
function getWeather() {
const city = document.getElementById('city').value;
if (!city) {
alert('請輸入城市名稱');
return;
}
const url = https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apiKey}&units=metric&lang=zh_cn;
fetch(url)
.then(response => response.json())
.then(data => {
document.getElementById('cityName').innerText = data.name;
document.getElementById('temperature').innerText = data.main.temp + '°C';
document.getElementById('description').innerText = data.weather[0].description;
})
.catch(error => {
console.error('獲取天氣信息失敗:', error);
alert('獲取天氣信息失敗,請檢查城市名稱是否正確');
});
}
4、用瀏覽器打開weather.html文件,輸入城市名稱并點擊查詢按鈕,即可顯示該城市的實時天氣信息。
新聞標(biāo)題:html如何取天氣
分享路徑:http://fisionsoft.com.cn/article/djsssgp.html


咨詢
建站咨詢
