如何获取JSON中的第一个键值？

Question

我想使用 javascript/jquery 将 JSON 数据动态转换为 HTML table。我有 JSON 喜欢，

     {
        "Transaction Details":
        {
         "txnId":"TP20151515151S45",
         "txnNo":"201548484848484",
         "txnDate":"09-JAN-2021",
         "txnStatus":"success"
        }
     }

我可以使用 jquery 为以下 JSON、

生成 HTML table

{
               "txnId":"TP20151515151S45",
               "txnNo":"201548484848484",
               "txnDate":"09-JAN-2021",
               "txnStatus":"success"
       }
using below code

var col = [];
for (var i = 0; i < txnJson.length; i++) {
   for (var key in txnJson[i]) {
       if (col.indexOf(key) === -1) {
       col.push(key);
       alert(key);
       console.log(key);
       }
   }
}
var table = document.createElement("table");
var tr = table.insertRow(-1);                   // TABLE ROW.

for (var i = 0; i < col.length; i++) {
   var th = document.createElement("th");      // TABLE HEADER.
   th.innerHTML = col[i];
   tr.appendChild(th);
}
for (var i = 0; i < txnJson.length; i++) {

   tr = table.insertRow(-1);

   for (var j = 0; j < col.length; j++) {
       var tabCell = tr.insertCell(-1);
       tabCell.innerHTML = txnJson[i][col[j]];
   }
}
$('#Div<%=i%>').append(table);

但我想获取“交易详细信息”作为 table 名称和其他详细信息，如 txnId 作为键（header）和 TP20151515151S45 作为值（行）。我尝试使用 Object.keys(obj)[0] 获取第一个密钥，但无法实现相同的目的。怎么做到的？

Answer 1

首先，您需要在 JSON 字符串上调用 JSON.parse() 以创建实际的 Javascript 对象。然后你可以这样做：

tableData = JSON.parse(my_json)
for (prop in tableData)
{
   console.log(prop) // should output your keys, txnId, txnNo, etc
   console.log(tableData[prop]) //should output your your value for that field
}

您可以使用此循环为 table 生成 DOM 元素。

Answer 2

谢谢。现在我可以使用下面的代码实现相同的效果，

var tableName;
var colspan = 0;
var colHeader = [];
var rowValue = [];
for (var key in txnJson) {
    tableName = key;
        console.log(key);
    for (var secondKey in txnJson[key]) {
        console.log(secondKey + ' : ' + txnJson[key][secondKey]);
        for (var thirdkey in txnJson[key][secondKey]) {
            colHeader.push(thirdkey);
            rowValue.push(txnJson[key][secondKey][thirdkey]);
            colspan = colspan +1;
            console.log(thirdkey + ' : ' + txnJson[key][secondKey][thirdkey]);
        }
    }
}

这可能会对某人有所帮助。

如何获取JSON中的第一个键值？

How to get first key value in JSON?

java

jquery

json

jsp