我们在开发的时候针对DOM操作，用简单的JS应用来说不成问题，但如果你对视图的每次更新都需要对我文档中非常大量的块进行操作呢？这时JS模版就派上用场了。

源地址：

这是一个实例，我们可以把json的数据，按照自己的想法嵌入到模板里面。

              
Handlebars Expressions Example!
         
     
    
     
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                

看到这个例子，大家感觉很爽吧~  就是这样。。 我们可以通过后端取数据，然后扔到前端，而不用写各种 "" <> ''的分离符号。

进行遍历里面的数据，print出来

有数据的话，进行数据渲染

没有数据的话，就写没有数据

if else 关联的判断

源地址 ：

Handlebars.registerHelper('list', function (items, options)

items是后面的key值，options是handlebars取值用的

              
Handlebars Expressions Example!
         
     
    
     
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             

我在value加了div和h5的便签，通过开发者用具可以看到。

源地址：

列表的话，有个和jinja2很像的格式。

要是想动态的抓数据，那就用ajax来搞。

$("button").click(function(){  $.getJSON("demo_ajax_json.js",function(result){   //result 就是值    });  });});

我们可以把把result的值扔到模板里面~

$(document).ready(function() {            $('#btn1').click(function() {                $.ajax({                    type: "POST",   //使用Post方式请求                    contentType: "application/json",                    url: "Default2.aspx/HelloWorld",                    data: "{}",  //这里是要传递的参数，格式为 data: "{paraName:paraValue}",下面将会看到                        dataType: 'json',   //会返回Json类型                    success: function(result) {     //回调函数，result，返回值                        //result 是我们需要的值。。。。                    }                });            });        });        //有参数调用

为什么使用 Handlebars.js？

赞成

• 它是一个弱逻辑模板引擎

• 你可以在服务端预编译模板

• 支持 Helper 方法

• 可以运行在客户端和服务端

• 在模板中支持 `this` 的概念

• 它是 Mustache.js 的超集

• 你能想到其他的吗？

反对

• 你能想到任何理由吗？

总结~    这是一个很棒的js模板引擎~  当然功能上没有backbone.js  angularjs.js  强大，但是他的优点很明显，就是小数据的展现还是相当的容易的。