快速开始

<script type="text/x-handlebars-template" id="art-tpl">
    <div class="article">
        <h1>{{title}}</h1>
        <div class="content">
            {{content}}
        </div>
    </div>
</script>

var data={
    title:"hello",
    content:"osoLife"
};
var source=$("#art-tpl").html();
var tpl=Handlebars.compile(source);
var html=tpl(data);

each的基本使用

<table border="1">
    <thead>
        <tr>
           <th>姓名</th>
           <th>性别</th>
           <th>年龄</th>
        </tr>
    </thead>
    <tbody>
            
    </tbody>
</table>

<script type="text/x-handlebars-template" id="table-tpl">
    {{#each student}}
        <tr>
          <td>{{name}}</td>
          <td>{{sex}}</td>
          <td>{{age}}</td>
        </tr>
    {{/each}}
</script>

var data={
    "student":[
                {
                    "name":"moli",
                    "sex":"男",
                    "age":"18"
                },              
                {
                    "name":"osoLife",
                    "sex":"男",
                    "age":"28"
                },
                {
                    "name":"michael",
                    "sex":"男",
                    "age":"38"
                }
    ]
};
var tpl=Handlebars.compile($("#table-tpl").html());
$("tbody").html(tpl(data));