ajax 天气预报
时间: 2023-12-16 18:04:47 浏览: 51
以下是一个使用Ajax获取天气预报信息的示例代码:
```javascript
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 设置请求方法和请求地址
xhr.open('GET', 'http://api.weatherapi.com/v1/forecast.json?key=YOUR_API_KEY&q=YOUR_CITY&days=3');
// 发送请求
xhr.send();
// 监听状态变化
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 解析响应数据
var response = JSON.parse(xhr.responseText);
var forecast = response.forecast.forecastday;
// 处理天气预报信息
forecast.forEach(function(dayForecast) {
var date = dayForecast.date;
var maxTemp = dayForecast.day.maxtemp_c;
var minTemp = dayForecast.day.mintemp_c;
var condition = dayForecast.day.condition.text;
// 在页面上显示天气预报信息
var forecastStr = date + ': ' + condition + ', 最高温度 ' + maxTemp + '℃, 最低温度 ' + minTemp + '℃';
document.getElementById('forecast').innerHTML += forecastStr + '<br>';
});
}
};
```
在上面的代码中,我们使用XMLHttpRequest对象发送了一个GET请求,请求地址是一个天气预报API。当请求成功后,我们解析响应数据,提取出需要的天气预报信息,并将其显示在页面上。