Javascript 使用JS for循环从json中定制动态嵌套ul列表

您好，我正在尝试使用javascript中的for循环从json呈现动态嵌套ul列表

在尝试了几个小时后，我终于能够让它工作了，我需要修复一些小细节，例如，我的javascript将所有对象呈现为html元素，如何仅呈现视图上所需的元素，例如：

<ul class="some_class">
    <li>
        <h3>
            level_0_name => Africa
            <input type="checkbox" name="level_0_id => VALUE HERE" id="">
        </h3>
        <ul class="some_class">
            <li>
                <h3>
                    level_1_name => Company San Fracisco
                    <input type="checkbox" name="level_1_id => VALUE HERE" id="">
                </h3>
                <ul class="some_class">
                    <li>
                        <h3>
                            level_2_name => Some title
                            <input type="checkbox" name="level_2_id => VALUE HERE" id="">
                        </h3>
                        <ul class="some_class">
                            <li>
                                <h3>
                                    John Doe                                                
                                    <input type="checkbox" name="" id="" value="id VALUE">
                                </h3>
                            </li>

如果不需要渲染标记，是否有一种简单的方法只渲染具有实际值（如“level_1_id”=>“12345”）的对象到列表中

这是JS函数：

function tree(data) {    
    if (typeof(data) == 'object') {        
        var ul = $('<ul>');
        for (var i in data) {            
            ul.append($('<li>').text(i).append(tree(data[i])));         
        }        
        return ul;
    } else {       
        var textNode = document.createTextNode(' => ' + data);
        return textNode;
    }
}

$(document.body).append(tree(data));

函数树（数据）{
如果（数据的类型）=‘对象’{
var ul=$（“
”）；
对于（数据中的变量i）{
ul.append（$（'
）.text（i）.append（tree（data[i]））；
}        
返回ul；
}否则{
var textNode=document.createTextNode（'=>'+数据）；
返回文本节点；
}
}
$（document.body）.append（树（数据））；

function tree(data) {    
    if (typeof(data) == 'object') {        
        var ul = $('<ul>');
        for (var i in data) {            
            ul.append($('<li>').text(i).append(tree(data[i])));         
        }        
        return ul;
    } else {       
        var textNode = document.createTextNode(' => ' + data);
        return textNode;
    }
}

$(document.body).append(tree(data));