javascript - 如何将我正在使用的这个 API 的 JSON 响应分配给我页面上的元素？

Question

我正在尝试使用来自https://developer.forecast.io的 API，我收到 JSON 响应，这是我第一次使用 API，我真正需要知道的是，我该怎么做将我从他们的 API 返回的 JSON 响应分配给我页面上的元素。谢谢！

这是通过我的标题中的脚本标签完成的：

脚本（src=' https://api.forecast.io/forecast/APIKEY/LAT,LON '）

Answer 1

http://api.jquery.com/jQuery.ajax/您需要添加一个成功回调，该页面底部是您可以查看的示例。

编辑

好的，我看到您在请求中使用了脚本标签，因为 api 在您当前的域之外，您需要发出 JSONP 请求

$(document).ready(function(){
    $.ajax({
        url: 'https://api.forecast.io/forecast/APIKEY/LAT,LON',
        dataType: 'jsonp',
        success: function(data){
            //do whatever you want with the data here
            $("body").append(JSON.stringify(data));
        }
    });
});

当然，您需要对该块进行一些调整，但您明白了

Answer 2

您正在寻找的是 DOM 操作。DOM 是 HTML文档对象模型，是构成文档的 HTML 的对象表示。有很多方法可以解决这个问题，但用于执行此任务的更流行的 Javascript 库之一是 jQuery。有关更多信息，请参阅有关操作的帮助文档类别。

好的，根据您的说明，您还没有使用 AJAX。我说“还没有”，因为你需要这样做。同样，我会为此推荐 jQuery，并将他们自己的文档作为最佳资源。对于简单的“获取”，您最简单的选择是getJSON 方法。

因此，在一个非常简单的级别上，您可能会执行以下操作：

$(function(){
    $.getJSON('url_to_api', function(data) {
        $("#SummaryBox").append("<div>" + data.hourly.summary + "</div>");
    }
});