新一代 javascript 模板引擎

artTemplate-3.0 新一代 javascript 模板引擎

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    
    <script type="text/javascript" src="js/template.js"></script>

    <script type="text/javascript" src="js/jquery.min.js"></script>    
    <body>
        <script id="test" type="text/html">
            <h1>{{title}}</h1>
            <ul>
                {{each list as value i}}
                    <li>索引 {{i + 1}} ：{{value}}</li>
                {{/each}}
            </ul>
        </script>

        <script type="text/javascript">
            var data = {
                title: '标签',
                list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
                        };
            var str = template('test', data);
            document.body.innerHTML = str;
            
        </script>
    </body>
</html>

输出内容

 

标签

索引 1 ：文艺
索引 2 ：博客
索引 3 ：摄影
索引 4 ：电影
索引 5 ：民谣
索引 6 ：旅行
索引 7 ：吉他

　　

posted @ 2017-03-07 22:16  北漂阿猫  阅读(119)  评论(0)    收藏  举报