0

我正在尝试使用 JQuery 创建一个非常简单的脚本，该脚本将从 URL 获取 JSON 数据集，使用硬编码参数过滤 JSON，并从结果过滤数据集中的一些数据中输出文本。我更喜欢使用 JQuery，但也对 JavaScript 选项持开放态度。此特定示例使用 NYC CitiBike 站点状态 JSON 提要并使用 168 的“station_id”变量（集合中的第一个站点）进行过滤。

我还希望每 30 秒刷新一次查询（或 div），而不刷新整个 HTML 页面。

下面是我试图完成的一个例子。它应该传达我想要完成的任务的一般意义。

<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaScript - read JSON from URL</title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>

<body>
    <div class="output"></div>

    <script>
    $.getJSON('https://gbfs.citibikenyc.com/gbfs/en/station_status.json', function(data) {
    var objects = data.stations.filter(function(v){return v.station_id==168});        

        var text = `Station ID: ${objects.station_id}<br>
            Bikes Available: ${objects.num_bikes_available}<br>
            Docks Available: ${objects.num_docks_available}'


        $(".output").html(text);
    });
    </script>

</body>
</html>
4

1 回答 1

0

如果您想要的只是可以使用的单个项目，find()而不是filter().

该数组也在属性中data.data.stations

$.getJSON('https://gbfs.citibikenyc.com/gbfs/en/station_status.json', function(data) {
  var item = data.data.stations.find(function(v) {
    return v.station_id == 168
  });

  var text = `Station ID: ${item .station_id}<br>
            Bikes Available: ${item.num_bikes_available}<br>
            Docks Available: ${item.num_docks_available}`


  $(".output").html(text);

});

至于重复这一点，您可以将其包装在一个函数中，并用于setInterval()在您需要的任何时间间隔调用该函数。

工作演示

于 2019-08-12T19:55:26.607 回答