發布一個開源極致的javascript模板引擎tpl.js


tpl.js(大家直接去https://git.oschina.net/tianqiq/tpl.js這個上面看)

簡介

tpl.js是一個比較極致(極小,極快,極簡單)的js模板引擎,可以在各種js環境中使用。

特性

1. 使用js作為模板語言,幾乎無學習成本
2. 小巧,速度快到極致
3. 極簡的語法,模板書寫非常流暢
4. mit開源,無限制

語法說明

簡述

tpl.js中模板語法中以行為單一,分為js行語句,和輸出行語句。顧名思義,js行語句是編譯時候會當做js執行的語句,
而輸出行語句,則是會輸出為html。

具體語法

1. 以行為單位,每一行作為語句塊,並去掉行前后空白字符
2. 如果行不是以<(左尖括號)開頭,則視為js,如果不是,則視為該行為輸出行
3. 如果行以!(嘆號)開頭,也視該行為輸出行。如 !aa
4. 在輸出行中通過@{exp}這樣的表達式作為js變量輸出。@{item.name}
5. 如果exp以.(點)開頭,則自動解析為上個exp表達式中最后一個點的前面部分。如@{.name},將自動解析為@{item.name}
6. 如果4中exp無特殊字符,如"、'、'<、 >等。則可以省略{}中括號。如@.item.name @.name @func(item) @list[i]
7. 如果行以!!2個嘆號開頭,則視該行為純輸出行,不解析@表達式,原樣輸出。如!!abc@def
8. 如果行中出現@又不想要tpl.js解析,則通過\轉義。如\@abc

示例

API

  • tpl.html(tplText,daata)

    通過傳遞tplText模板,和數據data直接獲取模板生成的html代碼。

  • tpl.func(tplText)

    將tplText編譯為一個函數,該函數參數在模板中通過tplData引用。 調用后返回模板編譯后的html代碼。

  • tpl.render()

    自動渲染整個網頁中的<script type="tpl">標簽中的模板。並能保證html dom中原有的結構。相當於替換掉了原來的<script type="tpl">標簽

最后

上面的文檔包括了tpl.js所有的語法了,歡迎大家測試與反饋。
源碼地址:https://git.oschina.net/tianqiq/tpl.js

測試地址:http://runjs.cn/code/wlztch4d

真的無語,上面文檔里面```html


折騰半天,也不知道怎么搞。大家直接去https://git.oschina.net/tianqiq/tpl.js這個上面看吧。哎...


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM