百度模板

引用script

    <script src="baiduTemplate.js" charset="UTF-8">
    </script>

模板语法

<script id="header" type="text/html">
    <h1>姓名:<%=name%></h1>
    <h1>年龄:<%=age%></h1>
    <ul>
        <%for(var i=0;i<foods.length;i++){%>
            <li><%=foods[i]%></li>
        <%}%>
    </ul>

</script>

直接写html代码，如果需要加js代码则需要用<% js代码  %>
若是变量则<%= 变量%>

然后在下面正常写js代码
<script>
    var data={
        name:'xiaoming',
        age:13.5,
        foods:['蒸羊羔','蒸熊掌','一盆米饭我够了']
    };


    // 生成html片段
    var html=baidu.template('header',data);
    console.log(html);

</script>

拓展: artTemplate

artTemplate有两种语法，所以就有两个库，
一种是简洁语法，一种是原生语法,引用方法类似于baidu.Template,但是性能优于baidu.Template；

• 简洁语法

    <h1>{{title}}</h1>
    <ul>
        {{each list as value i}}
            <li>索引{{i+1}}:{{value}}</li>
        {{/each}}
    </ul>

用each方法循环

• 原生语法
  类似于baidu.Template；

    <h1><%=title%></h1>
    <ul>
        <%for(var a of item){%>
            <li><%=a%></li>
        <%}%>
    </ul>