Question

我有一个有趣的问题，我有问题的逻辑，但我没有运气提出解决方案。

基本上，我有JSON对象（可以是任何形状或大小），类似于下面列出的对象：

    {
  "keyHigh": {
    "title": "Sign In Page",
    "key2": {
      "keyA": "Hey!",
      "keyB": "This!",
      "keyC": "Is!",
      "keyD": "All!",
      "keyE": "Example!",
      "keyF": "Content!",
      "keyG": "Hopefully!"
    },
    "key3": {
      "keyH": "This!",
      "keyI": "Illustrates!",
      "keyJ": "My Point!",
      "keyK": "Please!",
      "keyL": "Help!"
    },
    "key4": "/test.html#/"
  }
}

现在，我想要完成的是，我想循环遍历JSON对象（类似于上面的那个）并生成一个＆＃34;键＆＃34;价值对。我希望能够生成如下表所示的表，使用$来分隔键：

＆＃13;

<table>
  <tr>
    <th>Tag</th>
    <th>Content</th>
  </tr>
  <tr>
    <td>$keyHigh$title</td>
    <td>Sign In Page<br></td>
  </tr>
  <tr>
    <td>$keyHigh$key2$keyA</td>
    <td>Hey!</td>
  </tr>
  <tr>
    <td>$keyHigh$key2$keyB</td>
    <td>This!</td>
  </tr>
  <tr>
    <td>$keyHigh$key2$keyC</td>
    <td>Is!</td>
  </tr>
  <tr>
    <td>$keyHigh$key3$keyJ</td>
    <td>My Point!<br></td>
  </tr>
  <tr>
    <td>$keyHigh$key4</td>
    <td>/test.html#/</td>
  </tr>
</table>

＆＃13;

注意****我想要所有＆＃34;标签＆＃34;，而不仅仅是特定的＆＃34;标签＆＃34;

我应该如何以动态方式获取这些多键值对？

谢谢！

Answer 1

我将jQuery用于$.each循环和append函数，但这也可以通过纯JS实现。

function layOut(keyString, obj) {
  if (typeof obj == "object") {
    $.each(obj, function (key, val) {
      layOut(keyString + "$" + key, val);
    });
  } else {
    $("table.layout").append("<tr><td>" + keyString + "</td><td>" + obj +"</td></tr>");
  }
}

想法是检查是否达到了最深层次。这可以使用typeof完成。对于开始调用，您需要将空字符串作为keyString传递。所以它将是layOut("", obj);

如何遍历嵌套的JSON对象并在Javascript

1 个答案: