Форум

Marson · #1 (**permalink**) 11.12.2018, 20:30

var someTree = {
    tagName: "table", //html tag
    subTags: [ //вложенные тэги
        {
                    tagName: "tr",
                    subTags: [
                        {
                            tagName: "td",
                            text: "some text",
                        },
                        {
                            tagName: "td",
                            text: "some text 2",
                        }
                    ]
        }
    ],
    attrs: 
    {
        border: 1,
    },
}

Помогите дописать код, нужно с рекурсией, вот мой код:

var someTree = {
    tagName: "table", //html tag
    subTags: [ //вложенные тэги
        {
                    tagName: "tr",
                    subTags: [
                        {
                            tagName: "td",
                            text: "some text",
                        },
                        {
                            tagName: "td",
                            text: "some text 2",
                        }
                    ]
        }
    ],
    attrs: 
    {
        border: 1,
    },
}

function walker(node, nestedFieldName, deepness, callback){
    callback(node, nestedFieldName, deepness);
    if (nestedFieldName in node){
        for (key in node[nestedFieldName]){
            walker(node[nestedFieldName][key], nestedFieldName, deepness +1, callback)
        }
    }
}

var str = "";
walker(someTree, "subTags", 0, function(node, nestedFieldName, deepness){
    str += "  ".repeat(deepness) + node.tagName + "\n";
});

console.log(str);

Должно получиться:

<table border=1>
<tr>
<td>some text</td>
<td>some text 2</td>
</tr>
</table>

рони · #2 (**permalink**) 11.12.2018, 21:15

Marson,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">


</head>

<body>
  <script>
var someTree = {
    tagName: "table",
    subTags: [{
        tagName: "tr",
        subTags: [{
            tagName: "td",
            text: "some text"
        }, {
            tagName: "td",
            text: "some text 2"
        }]
    }],
    attrs: {
        border: 1
    }
};

function createElem(tagName, attrs, text) {
    var elem = document.createElement(tagName);
    if (attrs)
        for (var name in attrs) elem.setAttribute(name, attrs[name]);
    if (text) elem.textContent = text;
    return elem
}

function walker(tree) {
    var tagName = tree.tagName,
        attrs = tree.attrs,
        text = tree.text,
        elem = createElem(tagName, attrs, text);
    if (tree.subTags) tree.subTags.forEach(function(el) {
        el = walker(el);
        elem.appendChild(el)
    });
    return elem
}
var table = walker(someTree);
document.body.appendChild(table);
  </script>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript