使用天气 API

Using weather apis

本文关键字:API      更新时间:2023-09-26

我想创建一个简单的网页,从 wunderground.com 中提取潮汐结果。不过似乎什么都没有出现。我插入了load功能,以便在页面加载时显示某些内容,然后从那里开始工作(对我的网站进行样式化),但除了我的标题之外,似乎没有其他内容显示。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript"></script>
<h1>Tide High/Low</h1>
<section id="fetch">
  <div id="tweets"></div>
<style>
body {
  background: #00CCFF;
}
h1 { 
  font-size: 100px;
  font-weight: bold; 
  text-align: center;
  font-family: sans-serif;
  color: white;
}
#search {
  font-size: 15px;
  left: 200px;
  font-weight: bold; 
  font-family: sans-serif;
  color: #00CCFF;
  margin-left: 275px;
}
</style>
<script>
$("#tweets").load("http://api.wunderground.com/api/961d546ea36a6968/tide.json",
    function(responseTxt,statusTxt,xhr){
      if(statusTxt=="success")
          alert("External content loaded successfully!");
      if(statusTxt=="error")
          alert("wuddup: "+xhr.status+": "+xhr.statusText);
});
function getWeather(callback) {
  var weather = 'http://api.wunderground.com/api/961d546ea36a6968/tide.json';
  $.ajax({
    dataType: "jsonp",
    url: weather,
    success: callback
  });

getWeather(function (data) {
  console.log('weather data received');
  console.log(data.list[0].weather[0].description); 
  console.log(data.list[0].weather[0].main);  
});
</script> 

对于初学者来说,您的getWeather函数声明缺少结束}。一旦修复,它至少会以或多或少预期的方式失败。(您还有一个未关闭的<section>标签和一个空的<script>标签,但这些还不是真正的问题)。

您应该研究哪些 linting 工具可用于您的开发环境,或者使用内置的 IDE。或者,您可以使用jsHint之类的东西在线检查javascript,但是显然,如果您可以在编码环境中这样做,那会容易得多。

还应该熟悉适用于您首选浏览器的调试工具;我个人认为Chrome开发工具是必不可少的,但几乎所有浏览器都有类似的工具可用。

相关文章:
  • 没有找到相关文章