Question

我没有收到任何错误，它将无法正常工作。除了获取以外，还有其他更简单的方法吗？使用回调会更有意义吗？我遵循了有关YT的教程，但我的方法无法正常工作，我确实打算将其分解为我尚未到达的其他文件

<!DOCTYPE html>
<html>

<body>
  <div class = 'input'>
  <input type='text' class = 'input' placeholder= 'Enter City Name'>
  <input type='submit' id='submit' class = 'button'>
</div>
<div class= 'display'>
  <h1 class = 'name'></h1>
  <p = 'desc'></p>
  <p class= 'temp'></p>
</div>

<script type= javascript>
  const button = document.querySelector('.button');
  const input= document.querySelector('.input');
  const name = document.querySelector('.name');
  const desc = document.querySelector('.desc');
  const temp = document.querySelector('.temp');

button.addEventListener('click', function(){
  fetch('api.openweathermap.org/data/2.5/forecast?q='+input.value+'&appid={your+key}&units=imperial')
.then(response => response.json())
.then(data => console.log(data))
var nameValue = data['name'];
var tempValue = data['list'][0]['main']['temp'];
var descValue = data['weather'][0]['description'];

name.innerHTML= nameValue;
temp.innerHTML = tempValue;
desc.innerHTML = descValue;
})
</script>
</body>
</html>

打开天气地图API

0 个答案: