Javascript 如何使用jQuery使用divs将JSON树呈现为嵌套的HTML？

我正在寻找一种使用嵌套的

呈现JSON树的方法，如标题中所述。以下是数据示例（树中最多有8个级别）：

我可以获取/解析JSON树并将其保存到变量中。现在我需要递归遍历树，并且：

使每个节点成为可以呈现为HTML的内容

创建一个新的

div

节点并添加到新树中

---

但是怎么做呢？

您可以在原始JS中轻松完成这项工作：

function json2html(json) {
    var i, ret = "";
    ret += "<ul>";
    for( i in json) {
        ret += "<li>"+i+": ";
        if( typeof json[i] === "object") ret += json2html(json[i]);
        else ret += json[i];
        ret += "</li>";
    }
    ret += "</ul>";
    return ret;
}

---

我已经注意到了Node.js，但为了了解更多jQuery.1，我现在不想这样做。请编辑问题并格式化JSON，使其与您想要的内容明显相似。2.到目前为止你试过什么？我试过这个：。布局正常，但切换会影响错误的节点。恐怕代码很笨拙。

function json2html(json) {
    var i, ret = "";
    ret += "<ul>";
    for( i in json) {
        ret += "<li>"+i+": ";
        if( typeof json[i] === "object") ret += json2html(json[i]);
        else ret += json[i];
        ret += "</li>";
    }
    ret += "</ul>";
    return ret;
}

function json2html(json) {
    var i, ret = document.createElement('ul'), li;
    for( i in json) {
        li = ret.appendChild(document.createElement('li'));
        li.appendChild(document.createTextNode(i+": "));
        if( typeof json[i] === "object") li.appendChild(json2html(json[i]));
        else li.firstChild.nodeValue += json[i];
    }
    return ret;
}