Question

这可能是重复的，但我还没有找到解决问题的方法，尽管我已经检查了大量其他JSON递归转换函数的例子。

我的json obj看起来有点像：

var obj = 
{
    "description": [
    {
        "list": [
            {
                "1": "here is text"
            },
            {
                "2": "other text"
            },
            {
                "3": "arbitrary text"
            },
            {
                "4": [
                    {
                        "1": "indented"
                    },
                    {
                        "2": {
                            "1": "indented to second level"
                        }
                    },
                    {
                        "3": "first indentation level again"
                    },
                    {
                        "4": {
                            "1": "second level again"
                        }
                    },
                    {
                        "5": "and first level, to wrap things up"
                    }
                ]
            }
        ]
    }
]
};

用以下内容遍历：

function recurTrav (jsonObj) {
    $.each(jsonObj.description[0], function (key, value) {

        $(".testul").append("<li class=" + key + ">" + value + "</li>");

        if (typeof(jsonObj[key] == "object")) {
            recurTrav(jsonObj[key]);
        }
    });
}
recurTrav(obj);

什么都不给我。（请注意，这只是为了测试我将如何遍历。我被卡住了，而且令人尴尬。

我想我只需要向正确的方向推进......

我实际上要做的是将其创建为无序列表结构。在主要的ul里面可以有uls。

<ul>
    <li>here is text</li>
    <li>other text</li>
    <li>arbitrary text</li>
    <li>
        <ul>
            <li>indented</li>
            <li>
                <ul>
                    <li>indented to second level</li>
                </ul>
            </li>
            <li>first indentation level again</li>
            <li>
                <ul>
                    <li>second level again</li>
                </ul>
            </li>
            <li>and first level, to wrap things up</li>
        </ul>
    </li>
</ul>

Answer 1

我的处理方式略有不同。首先，我让recurTrav()返回DOM树。在最简单的情况下，它将是平坦的<ul></ul>。如果它遇到嵌套列表，它会在<li></li>中包装内部递归的结果。

因此...

function recurTrav(jsonObj) {
    var cont = $('<ul/>');

    $.each(jsonObj, function (key, value) {
        var el = $('<li/>');

        if (typeof(jsonObj[key]) == "object") {
            el.append(recurTrav(value));
        } else {
            el.attr('class', key);
            el.html(value);
        }

        cont.append(el);
    });

    return cont;
}

var dom = recurTrav(jsonObj.description[0].list);

迭代嵌套的数字键控json对象

1 个答案: