高德api获取天气（详细步骤）
1.登录高德开放平台，点击创建新应用，输入应用名称，选择应用类型，然后点击创建
2.点击添加key，按照以下步骤：
3.然后提交后点开就能看到你的key
4.以下就是示例代码：
<!-- 高德获取天气坐标 -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="weather-info"></div>
</body>
<script>
let xhr = new XMLHttpRequest();
// 发送请求
// city=后面写你自己的地区的坐标编码，key=后面写你自己的
xhr.open("GET", "https://restapi.amap.com/v3/weather/weatherInfo?city=410100&key=放你的key");
xhr.onload = function () {
// if (xhr.readyState === 4 && xhr.status === 200) {
let tianqi = JSON.parse(xhr.responseText);
const liveWeather = tianqi.lives[0];
console.log(tianqi);
const a = document.getElementById('weather-info');
a.innerHTML = `
<h2>${liveWeather.province} ${liveWeather.city}</h2>
<p>${liveWeather.weather}</p>
<p>${liveWeather.temperature}°C</p>
<p>${liveWeather.winddirection}</p>
<p>${liveWeather.windpower}</p>
<p>${liveWeather.humidity}%</p>
<p>${liveWeather.reporttime}</p>
`;
// }
};
// xhr.onerror = function () {
// console.log(xhr.status, xhr.statusText);
// document.getElementById('weather-info').innerHTML = 'Failed to load weather information.';
// };
xhr.send();
</script>
</html>原文地址：https://blog.csdn.net/m0_72189003/article/details/140559918
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！