通过嵌套对象/阵列迭代(Iterating through nested objects/array

我想通过一个对象，可以有数组的几个层次进行迭代。

例如。

我开始：

var htmlString = {
    "div": [{
        "attributes": {
            "class": "myDivClass"
        },
        "p": [{
            "attributes": {
                "class": "myPClass"
            }
        }]
    }]
};

现在让我们添加别的东西：

var htmlString = {
    "div": [{
        "attributes": {
            "class": "myDivClass"
        },
        "p": [{
            "attributes": {
                "class": "myPClass"
            },
            "span": [{
                "attributes": {
                    "class": "mySpanClass"
                }
            }]
        }]
    }]
};

我工作的代码将具有相同类型的形状为：

var childNode = document.createElement("myChildElement");
for (key in value) {
    if (value.hasOwnProperty(key)) {
        if (key == "attributes") {
            childNode.setAttributes(myAttributes); // loop through attributes on the element
        }
        else {
            //the same code ad infinitum
            var childChildNode = document.createElement("myChildChildElement");
            // etc etc....
        }
    }
}
parentNode.appendChild(childNode);

每个额外元素的规则是一样的，所以我应该能够公正循环下来这个数据结构以同样的方式对代码的两件，我只是不知道如何，但我敢打赌，有一段时间（）循环在那里的某个地方。 谁能告诉我？

PS本地JavaScript，请，没有jQuery的！ （虽然，如果你有YUI3的答案，我会很感兴趣）。

Answer 1:

var createTree = function (node, data) {
    for (var key in data) {
        if (data.hasOwnProperty(key)) {
            if (key == "attributes") {
                node.setAttributes(myAttributes); // loop through attributes on the element
            }
            else {
                for (var i = 0; i < data[key].length; ++i) {
                    var childNode = document.createElement(key);
                    createTree(childNode, data[key][i]);
                    node.appendChild(childNode);
                }
            }
        }
    }
}

createTree(parentNode, htmlString);

Answer 2:

好吧，QNAN的代码需要一个小调整，因为它针对的不是得到一个分支的末端恰当的结束。 一旦到了最后，没什么好查了，没什么空长度导致错误。

我知道这是不好的做法，但它是晚了，我需要这个固定的，所以这里是我的好办法。

var createTree = function (node, data) {
    for (key in data) {
        if (data.hasOwnProperty(key)) {
            if (key == "attributes") {
                node.setAttributes(myAttributes); // loop through attributes on the element
            }
            else {
                try {
                    for (var i = 0; i < data[key].length; ++i) {
                        var childNode = document.createElement(key);
                        createTree(childNode, data[key][i]);
                        node.appendChild(childNode);
                    }
                }
                catch(error) {
                    console.log("there was an error");
                }
            }
        }
    }
}

createTree(parentNode, htmlString);

是的，这是正确的，我通过尝试埋葬错误/捕获它...然后什么都不做。 在家里的孩子不试试这个！

QNAN，再次感谢。

文章来源: Iterating through nested objects/arrays