最近在某網(wǎng)站看到了handlebars.js,出于好奇就百度了下這是神馬玩意,結(jié)果讓我很是歡喜,于是就開(kāi)始自學(xué)下,handlebars就幾個(gè)方法,蠻簡(jiǎn)單,言歸正傳!

以下是基本教學(xué)邏輯演示,會(huì)附完整代碼

測(cè)試案例就分為3大塊,頭、主體、尾:

<div id="header"></div><div class="contact" id="contact"></div><div id="footer"></div>

先來(lái)講講id="contact"主體有些什么內(nèi)容,html代碼就不貼了,直接看下圖:

移動(dòng)開(kāi)發(fā)培訓(xùn),Android培訓(xùn),安卓培訓(xùn),手機(jī)開(kāi)發(fā)培訓(xùn),手機(jī)維修培訓(xùn),手機(jī)軟件培訓(xùn)

handlebars的模版代碼如下:

移動(dòng)開(kāi)發(fā)培訓(xùn),Android培訓(xùn),安卓培訓(xùn),手機(jī)開(kāi)發(fā)培訓(xùn),手機(jī)維修培訓(xùn),手機(jī)軟件培訓(xùn)

<script id="contact-template" type="text/x-handlebars-template">
            <div class="tit">{{transformat info}}</div>            {{#tit}}            <span class="one">{{this}}</span> {{/tit}}&