如今Javascript的模板引擎有很多花竞，多到難以選擇岩瘦，以至於有個(gè)頁面幫助你選擇模板引擎。它們的設(shè)計(jì)目標(biāo)和特性也迥異唇敞，有基於字符串替換蔗草，也有基於Dom文檔樹操作。有的設(shè)計(jì)於瀏覽器端疆柔，也有的用於後端Node.js咒精，當(dāng)然還有前後端都支持如dust.js。如果你要開發(fā)單頁面應(yīng)用程序SPA旷档，流行的框架如AngularJS和EmberJS都包含了雙向數(shù)據(jù)綁定（two way data binding）模叙，因而不需要模板引擎了。
我近期開發(fā)熱聞網(wǎng)時(shí)鞋屈，也面臨模板引擎的選擇問題范咨。我個(gè)人很喜歡Angularjs這種雙向數(shù)據(jù)綁定，但是由於這個(gè)項(xiàng)目不是單頁面應(yīng)用程序厂庇，用AngularJS不適合渠啊。此外Handlebars.js也很火，可是它的變量標(biāo)記是{{.}}权旷，這與我後端的Jinja2模板標(biāo)記衝突昭抒，不予考慮。最後我決定使用小而精的Underscore.js庫炼杖。Underscore.js因它提供的大量函數(shù)式編程特性而聞名灭返。我這裏僅討論使用它裏面的template函數(shù)做模板引擎。然而坤邪，官方文檔中提到的例子太過簡單熙含。
var compiled = _.template("hello: <%= name %>");
如上，模板只是一個(gè)JS字符串艇纺，不適合複雜的模板怎静。幸好我之前看過另一種用法邮弹，更加優(yōu)雅。將模板的內(nèi)容嵌入一個(gè)script標(biāo)籤中蚓聘，如下所示腌乡。
<script type="text/template" id="comment">
<%- comment.user %> post <%- comment.text %>.
</script>
然後在正常的腳本中獲取這段模板內(nèi)容，並生成渲染函數(shù)夜牡。
<script>
var render = _.template($('script#comment').html(), {variable: 'comment'});
var data = { user: 'ab', text: 'hello' };
var?result = render(data);
上面片段中result便是參數(shù)渲染後的結(jié)果了与纽。是不是簡單有效呢？
