当前天气
script.js
javascript
// API密钥
const API_KEY = 'YOUR_API_KEY';// 加载当前天气数据
async function loadCurrentWeather() {const apiUrl = `${API_KEY}&units=metric`;const response = await fetch(apiUrl);const data = await response.json();const temperature = data.main.temp;const weatherIcon = data.weather[0].icon;const weatherDescription = data.weather[0].description;// 更新界面document.getElementById('temperature').textContent = `${temperature} °C`;document.getElementById('weather-icon').innerHTML = `
`;document.getElementById('weather-description').textContent = weatherDescription;
}// 加载天气预报数据
async function loadForecast() {const apiUrl = `${API_KEY}&units=metric`;const response = await fetch(apiUrl);const data = await response.json();const forecastList = document.getElementById('forecast-list');forecastList.innerHTML = '';// 提取未来3天的天气预报数据const forecastData = data.list.filter(item => item.dt_txt.includes('09:00:00'));forecastData.forEach(item => {const temperature = item.main.temp;const weatherIcon = item.weather[0].icon;const weatherDescription = item.weather[0].description;const date = new Date(item.dt 1000);const forecastItem = document.createElement('li');forecastItem.classList.add('forecast-item');forecastItem.innerHTML = `
${date.toLocaleDateString()}
${temperature} °C
${weatherDescription}
`;forecastList.appendChild(forecastItem);});
}// 加载数据
loadCurrentWeather();
loadForecast();