根据JSON数组重新排列HTML表格数据

Nomadev95

我有2个从Node API获取的JSON数组。但是,我无法在HTML表格上显示它们。

JSON数组

[ '127.0.0.1:27018', '127.0.0.1:27019', '127.0.0.1:27020' ]
[ 'SECONDARY', 'PRIMARY', 'SECONDARY' ]

AJAX电话

   $.ajax({
    url: "http://localhost:8070/api/route",
    type: 'POST',
    dataType:'json',
    data: {hostname: str1, port2: str2 },
    success: function(res) {
       console.log(res);
       $.each(['result1', 'result2'], function(i, key) {
           console.log("Index",i);
           console.log("Item",key);

           $.each(res[key], function(index, value){
               console.log("key",index);   
               console.log("Value",value);
               divData='';
               divData='<tr><td>'+index+'</td><td>'+value+'</td></tr>';
               $('#restab').append(divData);   
           });
       });

       }
   });

桌子以这种方式出来(参见图片)。我想要在表的第一列上的array1值和在第二列上的array2值。

在此处输入图片说明

这是所有控制台日志

{result1: Array(3), result2: Array(3)}
Index result1
Item (3) ["127.0.0.1:27018", "127.0.0.1:27019", "127.0.0.1:27020"]
key 0
Value 127.0.0.1:27018
key 1
Value 127.0.0.1:27019
key 2
Value 127.0.0.1:27020
Index result2
Item (3) ["SECONDARY", "PRIMARY", "SECONDARY"]
key 0
Value SECONDARY
key 1
Value PRIMARY
key 2
Value SECONDARY
不要投票

看一下这个:

let res = {result1: [ '127.0.0.1:27018', '127.0.0.1:27019', '127.0.0.1:27020' ],
           result2: [ 'SECONDARY', 'PRIMARY', 'SECONDARY' ] },
  html = '';
  
$.each(res.result1, function(i, key) {
  html+=' <tr><td>'+key+'</td><td>'+res.result2[i]+'</td></tr>';
});
 
$('table').append(html);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <th>Hostname</th>
    <th>Status</th>
  </tr>
</table>

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

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

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

来自分类Dev

重新排列HTML表格

来自分类Dev

根据值重新排列数组数据并更新键名称

来自分类Dev

PHP根据id重新排列数据

来自分类Dev

根据嵌套数组重新排列对象数组

来自分类Dev

使用Linq重新排列表格数据

来自分类Dev

JS / jQuery-重新排列HTML表格元素

来自分类Dev

根据公共键/值对重新排列对象数组

来自分类Java

Java根据元素编号重新排列数组

来自分类Dev

JavaScript:根据与x的绝对差重新排列数组元素

来自分类Dev

根据每个对象的ID重新排列数组

来自分类Dev

拆分数据并根据拆分号重新排列值

来自分类Dev

R:根据排名重新排列数据框的列

来自分类Dev

重新排列numpy数组

来自分类Dev

重新排列数据行

来自分类Dev

根据重新排列的重复片段(或如何删除重新排列的重复片段)切片熊猫数据框

来自分类Dev

重新排列表格中的值

来自分类Dev

根据窗口宽度重新排列链

来自分类Dev

重新排列数组索引雄辩的Laravel

来自分类Dev

在cmd中重新排列数组元素

来自分类Dev

重新排列NumPy数组中的值

来自分类Dev

在Python中重新排列数组

来自分类Dev

排序和重新排列(不同的)数组

来自分类Dev

重新排列Python argparse参数组

来自分类Java

用Java重新排列数组

来自分类Dev

AngularJS $ scope数组对象重新排列

来自分类Dev

根据某些列重新排列二维数组中的条目

来自分类Dev

熊猫重新排列数据框

来自分类Dev

R数据帧重新排列

来自分类Dev

如何重新排列熊猫数据框?

TOP 榜单

热门标签

归档