Question

我有一个工作递归函数，可以从一个对象创建一个<ul>列表，它工作正常，
我的问题是我想跟踪索引，并将其作为类添加到<li>元素，
我需要“索引计数系统”以特定方式计数，这是我想要的输出：

class0
    class0_0
        class0_0_0
        class0_0_1

    class0_1
        class0_1_0
        class0_1_1


class1
    class1_0
        class1_0_0
        class1_0_1

    class1_1
        class1_1_0
        class1_1_1

通过增加，重新启动并在recirsive函数中可能有多个“索引计数”变量

这就是我正在尝试的，但我仍然无法弄清楚在哪里正确设置，增加，重置计数器以实现该结果..

var i = 0;
function object2ul(data) {
    var json = "<ul>";

    for(var key in data) {
        json = json + "<li>" +'<b>'+i+'</b>'+ key; i++;
        if(typeof data[key] == 'object') {
            json = json + object2ul(data[key]);
        }else{ i=0;
            json = json + '<ul><li>'+ data[key]+'</li></ul>';
        }
        json = json + "</li>";
    }
    return json + "</ul>";
}

document.body.innerHTML = object2ul(object);

在这个例子中，我省略了设置类以避免使函数复杂化

DEMO

Answer 1

这样的东西？

＆＃13;

var object = {
    root0: {
        child0: {
            leaf: 'text',
            leaf: 'text'
        },
        child1: {
            leaf: 'text',
            leaf: 'text'
        }
    },
    root1: {
        child0:{
            leaf: 'text',
            leaf: 'text'
        },
        child1: {
            leaf: 'text',
            leaf: 'text'
        }
    }
};

var i = 0;
function object2ul(data, prefix) {
    prefix = prefix || '0'; // default
    var json = "<ul>";

    var childIndex = 0;
    for(var key in data) {
        json = json + "<li>" +'<b>'+i+'</b>'+ key; i++;
        if(typeof data[key] == 'object') {
            json = json + object2ul(data[key], prefix + '_' + childIndex);
        }else{ i=0;
            json = json + '<ul><li>'+ data[key]+'---(' + prefix + ')</li></ul>';
        }
        json = json + "</li>";
        childIndex++;
    }
    return json + "</ul>";
}

document.body.innerHTML = object2ul(object);

＆＃13;

Answer 2

要获得所需的索引类型，您将不得不使用Object.keys。以下内容适用于任意对象：

var testObj = { a: { b: '2', d: '5', e: { f: '3' } }, c: '3' };

var indexes = [];
var object2ul = function (data) {
    var keys = Object.keys(data);
    var json = "<ul>";
    for (var i = 0; i < keys.length; ++i) { 
        var key = keys[i];
        indexes.push(i);
        json += "<li>" + "<b>" + indexes.join('_') + "</b>" + key;
        if (typeof(data[key]) === 'object') {
            json += object2ul(data[key]);
        } else {
            json += "<ul><li>" + data[key] + "</li></ul>";
        }
        json += "</li>";
        indexes.pop();
    }
    return json + "</ul>";
}

document.body.innerHTML = object2ul(testObj);

这里有它的实际效果：

JSFiddle

递归地对象到ul列表并在javascript中添加带索引的类

2 个答案: