1. 程式人生 > >js模板引擎artTemplate快速上手

js模板引擎artTemplate快速上手

騰訊的artTemplate 1,編寫模板 (採用script標籤並帶有屬性id和type="text/html") <script id="test" type="text/html"> {{if isAdmin}} <h1>{{author}}</h1> <ul> {{each list as value i}} <li>{{i+1}}:{{value}}</li> {{/each}} </ul> {{/if}} </script> 2, 渲染模板 var data = { author: '宮崎駿', isAdmin: true, list: ['千與千尋', '哈爾的移動城堡', '幽靈公主', '風之谷', '龍貓'] };var html =
template('test', data); document.getElementById('content').innerHTML = html; 模板語法 有兩個版本的模板語法可以選擇。       1.簡潔語法,採用"{{ }}" 原生語法(採用"<%= %>") 使用原生語法,需要匯入template-native.js檔案。 方法 template(id, data)  根據 id 渲染模板。內部會根據document.getElementById(id)查詢模板,如果沒有 data 引數,那麼將返回一渲染函式。