数据应以javascript中的以下给定格式绑定

Question

我的JSON数据的格式为：

"x": {
        "xEnabled": "N",
        "1-a": "0.0",
        "2-b": "0.0",
        "1-c": "0",
        "2-d": "0"
    },
    "y": {
        "yEnabled": "N",
        "1-a": "0.0",
        "2-b": "0.0",
        "1-c": "0",
        "2-d": "0"
    },
    "z": {
        "zEnabled": "N",
        "1-a": "0.0",
        "2-b": "0.0",
        "1-c": "0",
        "2-d": "0"
    },
    "w": {
        "wEnabled": "N",
        "1-a": "0.0",
        "2-b": "0.0",
        "1-c": "0",
        "2-d": "0"
    }

我想将此数据绑定到HTML，我应该如何绑定此数据以这种格式获取

Data    1-a      2-b    1-c     2-d
x       0.0      0.0    0       0
y       0.0      0.0    0       0
z       0.0      0.0    0       0
w       0.0      0.0    0       0

Answer 1

尝试一下

var data = {
  "x": {
    "xEnabled": "N",
    "1-a": "0.0",
    "2-b": "0.0",
    "1-c": "0",
    "2-d": "0"
  },
  "y": {
    "yEnabled": "N",
    "1-a": "0.0",
    "2-b": "0.0",
    "1-c": "0",
    "2-d": "0"
  },
  "z": {
    "zEnabled": "N",
    "1-a": "0.0",
    "2-b": "0.0",
    "1-c": "0",
    "2-d": "0"
  },
  "w": {
    "wEnabled": "N",
    "1-a": "0.0",
    "2-b": "0.0",
    "1-c": "0",
    "2-d": "0"
  }
};

var a = document.querySelector("#t");
Object.keys(data).forEach((e, i) => {
  a.innerHTML += '<tr><td>' + e + '</td><td>' + data[e]["1-a"] + '</td><td>' + data[e]["2-b"] + '</td><td>' + data[e]["1-c"] + '</td><td>' + data[e]["2-d"] + '</td></tr>';
})

td {
  padding: 10px
}

<table id="t">
  <tr>
    <td>Data</td>
    <td>1-a</td>
    <td>2-b</td>
    <td>1-c</td>
    <td>2-d</td>
  </tr>
</table>