对 HTML 表的 JSON 响应答案

【问题标题】：JSON Response into an HTML Table对 HTML 表的 JSON 响应
【发布时间】：2017-07-27 15:56:45
【问题描述】：

我想将此信息从 HTTPS GET 请求中显示到信息中。

我要显示的内容：

[{"id":"833",
  "vps_id":"1924",
  "event":"Your new virtual cloud server has been deployed",
  "timestamp":"2015-05-03 07:52:55","IP":"176.42.87.106"},
 {"id":"834",
  "vps_id":"1924",
  "event":"Power Cycle",
  "timestamp":"2015-05-03 07:53:30","IP":"176.31.67.189"}

【问题讨论】：

标签： jquery json html-table

【解决方案1】：

当然有一种很酷的 jquery 方法可以用 2 行代码完成此操作，但有时直截了当的方法更容易理解：

$.http({
  url: myCoolURL,
  method: "GET"
}).then(function (result) {

  var tableHTML = "<table><tr><th>id</th><th>vps id</th><th>event</th></tr>";  

  $.each(result.data, function() {
    tableHTML += "<tr>";
    tableHTML += "<td>"+this.id+"</td>";
    tableHTML += "<td>"+this.vps_id+"</td>";
    tableHTML += "<td>"+this.event+"</td>";
    tableHTML += "</tr>";
  });

  tableHTML += "</table>";
  $("#tablediv").innerHTML = tableHTML;
});

【讨论】：

@DanWilliams 我编辑添加了 http 的东西。有几种方法可以做一个 httpget，所以你的可能有点不同。但基本上我的原始答案应该在您的 GET 的响应区域中。
@DanWilliams 尝试搜索基本的 jquery ajax 示例。 w3schools.com/ajax/tryit.asp?filename=tryajax_first 是一个非 jquery 示例（所以我的 $.each 将无法工作，除非你添加 jquery）
好的。 5 小时后，我将能够使用Skype。如果你现在想说话，只需在 Hangouts / gtalk 中添加我
@DanWilliams 抱歉，Skype 不会发生。我认为所有部分都在上面的链接和代码之间，你可以这样做！
这是我页面中的内容：

【解决方案2】：

我假设您的“结果”变量存储了这样的字符串：'[{"id":"833","vps_id":"1924","event":"您的新虚拟云服务器已部署", "时间戳":"2015-05-03 07:52:55","IP":"176.42.87.106"},{"id":"834","vps_id":"1924","事件":"电源循环","timestamp":"2015-05-03 07:53:30","IP":"176.31.67.189"}]'

如果我是对的，结果是：

试试这个：

<div id="divTable"></div>


<script> 
     $.http({ url: "Website is here but it's a private API link", method: "GET" })
     .then(function (result) { 

         var tableHTML = "<table border='1'><tr><th>id</th><th>vps id</th><th>event</th></tr>"; 

         var json = eval(result);

         var itemsCount = Object.keys(json[0]).length;

         for(x = 0; x < json.length; x++)
         {
             tableHTML += "<tr>";

             var counter = 0;

             for(var key in json[x])
             {
                 if(counter < 3)
                      tableHTML += "<td>" + json[x][key] + "</td>";

                 counter++;
             }


             tableHTML += "</tr>";
        }

        tableHTML += "</table>";

        $("#divTable").html(tableHTML);

</script>

在此处查看示例：https://jsfiddle.net/mjb4t5z1/2/

【讨论】：

但它来自一个网站，比如我在哪里放置链接？
这里我不能使用Skype。但我有视频群聊 marciogonzalez85@gmail.com
@DanWilliams 我更新了上面的代码。再试一次
嘿@DanWilliams 我再次更新了上面的代码。还有jsfiddle。阅读代码块上方的文字。