javascript - 寻找从JSON/object构建DOM客户端的JS库

Closed. This question is off-topic。它当前不接受答案。
                            
                        
                    
                
                            
                                
                
                        
                            
                        
                    
                        
                            想改善这个问题吗？ Update the question，所以它是on-topic，用于堆栈溢出。
                        
                        4年前关闭。
                                                                                            
                
        
乍一看，我似乎正在寻找一个简单的JS模板引擎，但是我所寻找的却更加复杂。起初，我考虑过自己编写代码，但是考虑得更多，但是我无法想象以前没有做过。

简而言之：我正在寻找将采用以下对象文字并构建以下HTML的内容。

{
    tagName   : 'div',
    className : 'container',
    children  :
    [
        {
            tagName   : 'h1',
            className : 'page-title',
            text      : 'My Awesome Page!'
        },
        {
            tagName   : 'a',
            className : 'class-i-gave-to-this-link',
            text      : 'Check out my other awesome page!',
            attr      :
            {
                href: 'http://my.awesome-page.com/'
            }
        }
    ]
}

所需的结果HTML：

<div class="container">
    <h1 class="page-title">My Awesome Page!</h1>
    <a class="class-i-gave-to-this-link" href="http://my.awesome-page.com/">Check out my other awesome page!</a>
</div>

最佳答案

这是我的递归解决方案：

var jsonToHtml = function(node) {
    var tag = document.createElement(node.tagName);
    tag.className = node.className || "";
    if(node.text) {
        tag.innerHTML = node.text;
    }
    if(node.children) {
        for(var i = 0; i < node.children.length; i++) {
            tag.appendChild(jsonToHtml(node.children[i]));
        }
    }
    if(node.attr) {
        for(var key in node.attr) {
            tag.setAttribute(key, node.attr[key]);
        }
    }
    return tag;
};

这是一个jsFiddle

关于javascript - 寻找从JSON/object构建DOM客户端的JS库，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12171652/