一、簡單示例
代碼：
1 function show(t) { 2 $("#content").html(t); 3 } 4 5 var view = { 6 title: 'YZF', 7 cacl: function () { 8 return 6 + 4; 9 } 10 }; 11 $("#content").html(Mustache.render("{{title}} spends {{cacl}}", view));
結果：
YZF spends 10
結論：
可以很明顯的看出Mustache模板的語法，只需要使用{{和}}包含起來就可以了，裏面放上對象的名稱。
通過本示例也可以看出，如果指定的屬性爲函數的時候，不會輸出函數裏面的內容，而是先執行函數，然後將返回的結果顯示出來。
二、不轉義html標籤
代碼：
1 var view = { 2 name: "YZF", 3 company: "<b>ninesoft</b>" 4 }; 5 show(Mustache.render("{{name}} <br /> {{company}} <br />{{{company}}}<br/>{{&company}}", view));
結果：
結論：
通過這個示例可以看出Mustache默認是會將值裏面的html標記進行轉義的，但是有時候我們並不需要。
所以這裏我們可以使用{{{和}}}包含起來，或者是{{&和}}包含，那麼Mustache就不會轉義裏面的html標記。
三、綁定子屬性的值
代碼：
1 var view = { 2 "name": { 3 first: "Y", 4 second: "zf" 5 }, 6 "age": 21 7 }; 8 show(Mustache.render("{{name.first}}{{name.second}} age is {{age}}", view));
結果：
結論：
相信看到第一個示例的時候，就會有人想到能不能綁定子屬性，如果你努力看下去了。
那麼祝賀你，現在就是解決你的需求的方式，僅僅只需要通過.來使用子屬性即可。
四、條件式選擇是否渲染指定部分
代碼：
1 var view = { 2 person: false 3 }; 4 show(Mustache.render("eff{{#person}}abc{{/person}}", view));
結果：
結論：
問題總是不斷，如果我們還需要能夠根據我們給的值，決定是否渲染某個部分。
那麼現在就可以解決這個問題，當然還要提示的就是不僅僅是false會導致不渲染指定部分。
null，空數組，0，空字符串一樣有效。語法上面比較簡單，就是使用{{#key}} ... {{/key}}
來控制中間的內容。
五、循環輸出
代碼：
1 var view = { 2 stooges: [ 3 { "name": "Moe" }, 4 { "name": "Larry" }, 5 { "name": "Curly" } 6 ] 7 }; 8 show(Mustache.render("{{#stooges}}{{name}}<br />{{/stooges}}", view));
結果：
結論：
僅僅學會上面的方式，大部分地方你都解決了，但是還是會出現麻煩的地方。
就是循環輸出，如果你一個一個寫，相信會很煩躁，當然Mustache不會讓我們失望，
它也給出瞭如何循環輸出的方式，這裏是將一個由對象組成的數組輸出，如果我們
輸出的是數組，就需要使用{{.}}來替代{{name}}。
六、循環輸出指定函數處理後返回的值
代碼：
1 var view = { 2 "beatles": [ 3 { "firstname": "Johh", "lastname": "Lennon" }, 4 { "firstname": "Paul", "lastname": "McCartney" } 5 ], 6 "name": function () { 7 return this.firstname + this.lastname; 8 } 9 }; 10 show(Mustache.render("{{#beatles}}{{name}}<br />{{/beatles}}", view));
結果：
結論：
循環輸出是有了，但是我們還想後期進行加工。那麼這個完全符合你的需要，因爲Mustache會將
數組中的值傳遞給你的函數，輸出你函數返回的值。這裏我們可以看到最外層是數組，只要在裏面
使用函數那麼外層的數組就會作爲這個函數的參數傳遞進去。
七、自定義函數
代碼：
1 var view = { 2 "name": "Tater", 3 "bold": function () { 4 return function (text, render) { 5 return render(text) + "<br />"; 6 } 7 } 8 } 9 show(Mustache.render("{{#bold}}{{name}}{{/bold}}", view));
結果：
結論：
上面我們都是用的變量作爲節，那麼我們現在用函數作爲節，會有什麼效果呢。
它會調用我們函數返回的函數，將節中間的原始字符串作爲第一個參數，默認
的解釋器作爲第二個參數，那麼我們就可以自行加工。
八、反義節
代碼：
1 var view = { 2 "repos": [] 3 }; 4 show(Mustache.render("{{#repos}}{{.}}{{/repos}}{{^repos}}no repos{{/repos}}", view));
結果：
結論：
上面我們也用節，但是僅僅只能選擇是否輸出某個部分。所以這裏我們彌補一下。
如果我們使用了{{^和}}來定義節的話，那麼這個部分只會在裏面的值爲空，null，
空數組，空字符串的時候纔會顯示。那麼我們就可以實現了if else的效果了。
九、部分模板
代碼：
1 var view = { 2 names: [ 3 { "name": "y" }, 4 { "name": "z" }, 5 { "name": "f" } 6 ] 7 }; 8 var base = "<h2>Names</h2>{{#names}}{{>user}}{{/names}}"; 9 var name = "<b>{{name}}</b>"; 10 show(Mustache.render(base, view, { user: name }));
結果：
結論：
Mustache雖然節約了很多時間，但是我們定義了很多模板，但是彼此之間無法互相嵌套使用，也會造成繁瑣。
所以這裏我們還要介紹如何定義部分模板，用來在其他模板裏面使用，這裏使用其他模板的方式僅僅是{{>templetename}}。
最大的不同就是Mustache.render方法有了第三個參數。
十、預編譯模板
代碼：
1 Mustache.parse(template); 2 //其他代碼 3 Mustache.render(template,view);
結論：
模板既然有好處，也有壞處。就是編譯模板需要時間，所以在我們已知會使用某個模板的前提下，我們可以預先編譯好這個模板，以便後面的使用。