文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在我的网页中显示开放天气地图API查询的响应？

问如何在我的网页中显示开放天气地图API查询的响应？
EN

Stack Overflow用户

提问于 2018-03-31 12:52:28

回答 1查看 1.2K关注 0票数 1

我想在html页面中显示城市莫金斯的天气状况。如何显示查询的响应？我正在用我自己的笔记本电脑在谷歌Chrome浏览器上进行测试。到目前为止，这就是我所拥有的：

<!DOCTYPE html>
<html>
  <head>
    <title>Weather</title>
  </head>
  <body>

    <script> 
        
      function getWeather() {
        var url = 'http://api.openweathermap.org/data/2.5/forecast/daily?q=morgins&APPID=001b0f58045147663b1ea518d34d88b4&mode=xml&units=metric&cnt=10';
        loadJSON(url, gotData);
        
      }

    </script>

  </body>    
</html>

现在是一个空白页，但我想显示一些天气要素，这10天的预报最终.

javascript

html

api

openweathermap

yahoo-weather-api

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-03-31 12:59:58

您的数据应该以JSON而不是xml的形式返回。将模式移除为xml，我也做了一些修改，如下所示，以便在div中显示数据。

演示

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Setup</title>
</head>
<body>
  <div id="app"></div>
  <div id="parsed_json_api">
  </div>

  <script src="index.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <!-- https://home.openweathermap.org/api_keys -->
  <script>

    jQuery(document).ready(function($) {

      var parsedData = $('#parsed_json_api');

      $.ajax({
        url: "https://api.openweathermap.org/data/2.5/forecast/daily?q=morgins&APPID=001b0f58045147663b1ea518d34d88b4&units=metric&cnt=10",
        dataType: 'json',
   
        success: function (data) {
          data = JSON.stringify(data);
          parsedData.append('<div>'+data+'</div>');
        }
      });
    });
  </script>

</body>
</html>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/49587952

复制

相似问题

问如何在我的网页中显示开放天气地图API查询的响应？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在我的网页中显示开放天气地图API查询的响应？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在我的网页中显示开放天气地图API查询的响应？
EN