最近幾年隨著web開發前後端分工越來越細,同時mvc、mvp模式大行其道,js模板引擎也越來越流行了
js模板引擎很多,我經常用的是arttemplate、jsviews這兩個模板引擎,12306用的就是jsviews
arttemplate 特性:
效能卓越,執行速度通常是 mustache 與 tmpl 的 20 多倍(效能測試)
支援執行時除錯,可精確定位異常模板所在語句(演示)
對 nodejs express 友好支援
安全,預設對輸出進行轉義、在沙箱中執行編譯後的**(node版本可以安全執行使用者上傳的模板
支援include包含模板
可在瀏覽器端實現按路徑載入模板(詳情)
支援預編譯,可將模板轉換成為非常精簡的 js 檔案
模板語句簡潔,無需字首引用資料,有簡潔版本與原生語法版本可選
支援所有流行的瀏覽器
簡單示例:
編寫模板
使用乙個type="text/html"的script標籤存放模板:
渲染模板
var data = ;
var html = template('test', data);
document.getelementbyid('content').innerhtml = html;
關於各種模板引擎效能對比可參考:
模板引擎使用
模板引擎可以讓將資料和html模板更加友好的結合,省去繁瑣的字串拼接,使 更加易於維護。art template 模板編譯 通過呼叫模板引擎提供的template函式,告知模板引擎將特定模板和特定資料進行拼接,最終返回拼接結果。模板引擎匯入 const template require art te...
模板引擎簡單使用
模板引擎實際上就是乙個 api,模板引擎有很多種,使用方式大同小異,目的為了可以更容易的將資料渲染到 html中。詳情模板引擎語法去官網檢視手冊,上面例舉一些模板引擎。先引入jquery.js檔案 寫jquery語句必須 在頁面中利用script引入模板引擎 建立乙個script標籤,幫後台資料與模...
騰訊js模板引擎 artTemplate 學習
使用方式 1.引入js檔案 2.建立模板 id test type text html 1 1 l i 索引 i l script 3.3.渲染資料至指定區域 var data var html template test data document.getelementbyid content i...