来自 API 的 JavaScript 中的 JSON 复杂数组解析

阿尔斯兰马利克

问题的背景> 好的,所以我正在尝试不同的技术来完成创建 Web 仪表板的工作。从具有按钮的 html 页面开始,单击该按钮将调用未打开的 api 请求,在表格中显示 json 响应。而不是以默认的字符串方式。我在做什么是我想到了使用首先将 api 请求保存到 .json 文件,然后使用 java 脚本读取上面显示的方法。另一方面,我创建了一个显示 json 响应的 .php 文件。我使用邮递员代码 curl php 来测试显示响应的 api。现在我如何在 JavaScript 中调用它的 php 文件。

下面是我通过 API 获取的 JSON 数据。我已将其保存为thinker.json文件。我想在不删除上述data数组信息的情况下在表中显示数据部分

例如 Name Mac Status

XYZ ABC 1

{
    "action":"list_host",
    "type":"all",
    "ack":"ok",
    "count":"3",
    "page":"1",
    "data":[
        {
            "name":"Host_34F60E",
            "mac":"C8EEA634F60E",
            "status":"0",
            "mark":""
        },
        {
            "name":"K-Electric",
            "mac":"5004BA2C9693",
            "status":"1",
            "mark":""
        },
        {
            "name":"Host_2C94E0",
            "mac":"00F4162C9693",
            "status":"0",
            "mark":""
        }
    ]
}

我该怎么做呢?如果我删除data数组上方的信息所以 JSON 会是这样的:

{
    "data":[
        {
            "name":"Host_34F60E",
            "mac":"C8EEA634F60E",
            "status":"0",
            "mark":""
        },
        {
            "name":"K-Electric",
            "mac":"5004BA2C9693",
            "status":"1",
            "mark":""
        },
        {
            "name":"Host_2C94E0",
            "mac":"00F4162C9693",
            "status":"0",
            "mark":""
        }
    ]
}

我使用此代码成功,但删除了上面的信息data

$(document).ready(function () {
    $.getJSON("thinker.json", function (data) {
        var thinker_data = '';
        $.each(data, function (key, value) {
            thinker_data += '<tr>';
            thinker_data += '<td>' + value.name + '</td>';
            thinker_data += '<td>' + value.mac + '</td>';
            thinker_data += '<td>' + value.status + '</td>';
            thinker_data += '</tr>';
        });
        $('#thinker_table').append(thinker_data);
    });
});

我正在使用 CURL PHP 函数来获取数据。


我已经应用了相同的功能来获取这样的宏数据:

$(document).ready(function(){
  $.getJSON("routines.json", function(macros)

但是,如果我还想使用上面相同的 java 脚本代码从下面的 json 响应中访问 mac 值呢?

{
    "amount": 4,
    "macros": [
        {
            "name": "Morning",
            "id": 1,
            "type": "onekey"
        },
        {
            "name": "Evening",
            "id": 2,
            "type": "onekey"
        },
        {
            "name": "Meeting Mode",
            "id": 3,
            "type": "onekey"
        },
        {
            "name": "Presentation Mode",
            "id": 4,
            "type": "onekey"
        }
    ],
    "ack": "ok",
    "action": "list_macro",
    "type": "all",
    "mac": "xxxxxxxx"
}

好的,在此之后,我如何调用该 php 文件,该文件使用 curl 选项在我编写此 JavaScript 的主 index.php 文件中显示 api 响应

阿瑟·施维达

只需像这样访问“数据”属性 data.data

<script>

$(document).ready(function(){
  $.getJSON("thinker.json", function(data){
     var thinker_data = '';
     $.each(data.data, function(key, value){
        thinker_data += '<tr>';
        thinker_data += '<td>'+value.name+'</td>';
        thinker_data += '<td>'+value.mac+'</td>';
        thinker_data += '<td>'+value.status+'</td>';
        thinker_data += '</tr>';      
     });
     $('#thinker_table').append(thinker_data);
    }); 
  });
</script>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

使用Javascript解析来自Api GET请求的JSON数据

在 RxSwift 中解析 JSON 并处理来自 API 的错误响应

在flutter中解析来自API的json数据的问题

在 JavaScript 中显示来自 json 关联数组的远程值

来自JavaScript中数组的总和

在 wordpress 中解码来自 API 的 JSON 响应

来自 Api 调用的 Java 中的 Json 建模

在javascript中过滤来自API的请求

如何在 JavaScript 中为来自 JSON API 的每个响应创建一个新的 div?

从角度解析来自API的JSON strnig

解析来自YouTube API的JSON响应

使用Web API控制器解析传入的JSON(来自javascript Ajax帖子)

Json 将复杂数组嵌套到 Web Api 2.0 控制器操作

来自api的ansible parse json数组回复

如何将来自JSON API响应的数据存储到ReactJS中的数组中?

如何在st中解析来自stdin的无限json数组?

来自javascript嵌套数组的json对象

在JavaScript中按字段合并对象的两个复杂数组

我如何解析来自node.js中的facebook graph api的json响应

将来自 API 服务的嵌套 JSON 响应解析为 python 中的 csv

如果这些数据来自 Laravel 中的 API,如何存储 JSON 数据数组数据库?

在没有API的情况下显示来自外部URL的JSON数组中的数据

如何将来自 API IGDB 的 JSON 响应存储到数组中

在 Rails 中解析来自 CURL 的 Json 请求

在 C# 中解析来自 json 的数据

在响应中显示来自数组的 API 数据

在 React 中显示来自 API 的对象数组

来自请求的ReactJS中的JSON数组映射

在 Swift 中显示来自 Json 的数组列表