首页 > 解决方案 > 从天气 API 显示温度

问题描述

我需要识别并修复错误。我在这里缺少什么,为什么?温度不显示。

<script type="text/javascript">
  $.ajax({
    url: 'https://api.weather.gov/gridpoints/EWX/155,90/forecast/hourly'
  }).done(function(res) {
    var temp = res.properties.periods[0].temperature;
  });
  document.getelementbyid('temperature').innerHTML = temp
</script>
<p>
  The temperature is <span id="temperature"></span>F.
</p>

标签: javascripthtmljsonajaxapi

解决方案


这里的问题是双重的。首先是有一个范围界定问题,试图将“临时”带到它准备就绪的时间之外。这仅在.done()通话中设置。

发现的第二个问题是document.getelementbyid应该按照document.getElementById()规范https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

<script type="text/javascript">
$(function() {
  $.ajax({
    url: 'https://api.weather.gov/gridpoints/EWX/155,90/forecast/hourly'
  }).done(function(res) {
      document.getElementById('temperature').innerHTML = res.properties.periods[0].temperature;
  });
});
</script>
<p>
    The temperature is <span id="temperature"></span>F.
</p>

推荐阅读