渲染HTML以实现多级JSON树结构

Question

请帮我渲染给定json的html。

我需要一个将构建树结构的递归函数。

鉴于Json是两用树。 一个节点可以有多个树。 但是每棵树只有两个节点。

所需的输出结构

{
  "tree_0":{
    "6629037861":{
      "tree_0":{
        "3669554975":{
          "tree_0":{
            "2039960559":false,"1328034918":false
          }
        },
        "3275450540":false
      }
    },
    "7652442898":{
      "tree_0":{
        "5586200617":{
          "tree_0":{
             "3265277560":false,"5222124962":false
          }
        },
        "4878276779":false
      }
    }
 },
 "tree_1":{
   "4521813934":{
     "tree_0":{
       "4437207316":false,
       "4034199320":false
     }
   },
   "8065858910":false
},
"tree_2":{
  "5350611753":false,
  "9257374001":false
},
"tree_3":{
   "8497444831":false,
   "8713068590":false
}
}

Answer 1

我不明白您在“仅左右两个节点”中的确切含义，但是我希望这个基本功能可以帮助您适应您的需求...

在示例“ treeObj”中使用的变量是您发布的完整json。

     function renderTree(tree) {
        var html = "<ul>";
        if( tree instanceof Object) {
            for(var i in tree) {
                html += "<li>" + i;
                html += renderTree(tree[i]);
                html += "</li>";
            }
        }
        else {
            html += "<li>" + tree + "</li>";
        }
        html += "</ul>";
        return html;
    }

    document.write(renderTree(treeObj));