（初学者问题）如何从 OpenWeatherMap API 获取特定数据答案

【问题标题】：(Beginner question) How do I get a specific data from an OpenWeatherMap API（初学者问题）如何从 OpenWeatherMap API 获取特定数据
【发布时间】：2019-04-23 11:25:13
【问题描述】：

我目前正在为我的学校作业创建一个网站（VWO 的期末论文，这是荷兰中学的最后一年），我有一个侧边栏，由于 API 可以提供当前温度我从 OpenWeatherMap 得到。

但搜索了几个小时后，我仍然不知道我应该怎么做。

在过去的几天里我刚刚“学习”了 html 和 css，所以我对它们的了解仍然是最低限度的，而且我已经正确理解了，我需要 javascript 来解决这个问题，但我仍然不完全也明白。

我目前在我的 .html 中有这段代码，我想显示从 OpenWeatherMap API 获取的当前温度，而不是 6 度：

<a href="#" style="float:right;">Outside Temp: 6&#8451</a>

（它是一个没有目的地的链接是因为它在带有引导程序的“侧边栏”中看起来更好）

但我不知道如何将 6℃ 更改为 276.01 开尔文，这是我从我的 API JSON 网站获得的数字：

{"coord":{"lon":5.39,"lat":51.5},"weather":[{"id":804,"main":"Clouds","description":"overcast clouds","icon":"04n"}],"base":"stations","main":{"temp":276.01,"pressure":1008,"humidity":69,"temp_min":275.15,"temp_max":277.15},"visibility":10000,"wind":{"speed":5.1,"deg":70},"clouds":{"all":90},"dt":1542749460,"sys":{"type":1,"id":5208,"message":0.0034,"country":"NL","sunrise":1542697565,"sunset":1542728514},"id":2759040,"name":"Best","cod":200}

所以我一直在网上和 w3schools 中浏览和搜索，并尝试根据 w3schools 使用以下脚本从 API 获取数据：

function loadDoc() {
  var openweathermapapi = new XMLHttpRequest();
  openweathermapapi.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var temperature = JSON.parse(this.responseText);
      document.getElementById("demo").innerHTML = this.responseText;
    }
  };


  openweathermapapi.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=Best&APPID=9c0299218db10c8423221d49842d8488", true);


  openweathermapapi.send();
}

按下运行 loadDoc 脚本的按钮后，我得到了完整的网站，但我只想要“main”变量中的“temp”部分，不知道如何获取它。

谢谢

PS：如果您不想回答这个问题，我完全理解，因为我可能做错了事或搜索了错误的事。我可能没有理由寻求帮助，因为我对编程的了解还不够多，而且我不知道这些问题是否被允许，因为我在常见问题解答中没有找到任何相关信息

【问题讨论】：

只需将 &units=imperial 添加到 API 请求 URL 的末尾即可。
1) 在您的问题中看不到您的应用程序 ID，否则有人会窃取它，2) 要访问 JSON 的部分内容，请使用点表示法 (w3schools.com/js/js_json_objects.asp)，这样就可以了。 responseText.main.temp
请让我知道它是否有效
我真的很感激这个答案，但遗憾的是我没有完全理解它，当时无法让它工作。但是我的搭档（我们的任务是分组的）后来有时间并且不知何故让它发挥了作用。再次感谢您！

标签： javascript html openweathermap

【解决方案1】：

这是获取当前位置的天气详细信息的示例

首先使用此获取您当前系统的位置

var getIP = 'http://ip-api.com/json/';

然后，它会以 json 格式返回您所在位置的详细信息

此代码获取有关位置的全部数据并将其设置到您的标签

var weatherjson = "";
var getIP = 'http://ip-api.com/json/';
var openWeatherMap = 'http://api.openweathermap.org/data/2.5/weather'
$.getJSON(getIP).done(function(location) {
    $.getJSON(openWeatherMap, {
        lat: location.lat,
        lon: location.lon,
        units: 'metric',
        APPID: 'APIKEY'
    }).done(function(weather) {

      //set temperature from json to your <a> tag
        $('#mytemp').text(weather.main.temp);
    })
})

以上代码说明：-

返回的样本 json

{
    "coord": {
        "lon": -122.08,
        "lat": 37.39
    },
    "weather": [
        {
            "id": 721,
            "main": "Haze",
            "description": "haze",
            "icon": "50n"
        },
        {
            "id": 711,
            "main": "Smoke",
            "description": "smoke",
            "icon": "50n"
        }
    ],
    "base": "stations",
    "main": {
        "temp": 11.84,
        "pressure": 1016,
        "humidity": 81,
        "temp_min": 10,
        "temp_max": 13.3
    },
    "visibility": 11265,
    "wind": {
        "speed": 1.13,
        "deg": 128.002
    },
    "clouds": {
        "all": 90
    },
    "dt": 1542782400,
    "sys": {
        "type": 1,
        "id": 471,
        "message": 0.003,
        "country": "US",
        "sunrise": 1542812064,
        "sunset": 1542848035
    },
    "id": 420006353,
    "name": "Mountain View",
    "cod": 200
}

主列包含您自己的位置的度数（TEMP）

"main": {
        "temp": 11.84,
        "pressure": 1016,
        "humidity": 81,
        "temp_min": 10,
        "temp_max": 13.3
    },

现在我们需要在显示层显示温度

<a href="#" id="mytemp" style="float:right;">Outside Temp: 6&#8451</a>

为您的温度提供一个身份，其中包含名为 ID 的锚标记，即“mytemp”

现在找到 ID 并更新温度

//set temperature from json to your <a> tag
            $('#mytemp').text(weather.main.temp);

【讨论】：