html前端获取和风天气
时间: 2023-10-30 07:08:41 浏览: 64
要在HTML前端获取和风天气的数据,你可以使用和风天气提供的API接口,通过JavaScript发送HTTP请求获取天气数据,然后再将数据显示在页面上。以下是一个简单的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>获取和风天气</title>
</head>
<body>
<h1>当前天气</h1>
<div id="weather"></div>
<script>
var url = 'https://free-api.heweather.net/s6/weather/now?location=北京&key=你的密钥';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
var weather = data.HeWeather6[0].now.cond_txt + ',温度:' + data.HeWeather6[0].now.tmp + '℃';
document.getElementById('weather').innerHTML = weather;
}
};
xhr.send();
</script>
</body>
</html>
```
注意,上面的代码需要替换URL中的“你的密钥”为你在和风天气申请的API密钥,同时也需要根据你的需求修改请求的参数,例如“location”可以指定获取某个城市的天气信息。
相关推荐
![py](https://img-home.csdnimg.cn/images/20210720083646.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)