问题的背景> 好的,所以我正在尝试不同的技术来完成创建 Web 仪表板的工作。从具有按钮的 html 页面开始,单击该按钮将调用未打开的 api 请求,在表格中显示 json 响应。而不是以默认的字符串方式。我在做什么是我想到了使用首先将 api 请求保存到 .json 文件,然后使用 java 脚本读取上面显示的方法。另一方面,我创建了一个显示 json 响应的 .php 文件。我使用邮递员代码 curl php 来测试显示响应的 api。现在我如何在 JavaScript 中调用它的 php 文件。
下面是我通过 API 获取的 JSON 数据。我已将其保存为thinker.json
文件。我想在不删除上述data
数组信息的情况下在表中显示数据部分:
例如 Name
Mac
Status
{
"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] 删除。
我来说两句