模板引擎簡單使用

2021-08-28 16:44:01 字數 1783 閱讀 4301

模板引擎實際上就是乙個 api,模板引擎有很多種,使用方式大同小異,目的為了可以更容易的將資料渲染到 html中。

詳情模板引擎語法去官網檢視手冊,上面例舉一些模板引擎。

先引入jquery.js檔案(寫jquery語句必須)

在頁面中利用script引入模板引擎

建立乙個script標籤,幫後台資料與模板引擎繫結

再建立乙個script標籤,設定type屬性,編寫html語句,已經利用模板引擎語句編寫,把想要的資料新增上去。

把這個script展示在頁面上。

舉例jsrender使用:

了解:

>

>

>

jsrender模板引擎使用title

>

head

>

>

>

>

>

width

="40"

>

type

="checkbox"

>

th>

>

作者th

>

>

>

>

>

>

提交於th

>

>

狀態th

>

tr>

thead

>

>

tbody

>

table

>

body

>

html

>

src=

"jquery.js"

>

script

>

src=

"jsrender.min.js"

>

script

>

"comments_tmpl"

type

="text/x-jsrender"

>

// 迴圈資料集

}// status,author,content,post_title,created是資料名字

// tr標籤中還使用了模板引擎if語句,判斷status不同的值採用不同的class樣式

}class

="warning"

}class

="danger"

}} data-id=

"}">

"checkbox"

>

<

/td>

}<

/td>

}<

/td>

}<

/td>

}<

/td>

} 待審

} 拒絕

} 同意

}<

/td>

<

/tr>

}script

>

>

// 這裡我是使用ajax請求後台php,返回json資料

$.getjson

('comments.php',,

function

(res));

// 在頁面新增展示資料

// 第六步$(

'tbody').

html

(html); })

;});

script

>

模板引擎使用

模板引擎可以讓將資料和html模板更加友好的結合,省去繁瑣的字串拼接,使 更加易於維護。art template 模板編譯 通過呼叫模板引擎提供的template函式,告知模板引擎將特定模板和特定資料進行拼接,最終返回拼接結果。模板引擎匯入 const template require art te...

PHP原生模板引擎 最簡單的模板引擎

複製 如下 php a array a b c require template demo.php 引用模板 程式設計客棧 模板檔案 複製代gkugmrgq碼 如下 程式設計客棧ype html 模板測試 a 程式設計客棧1 複製 如下 陣列的迭代 smarty 鍵值 對於php程式設計師那個更好理...

簡單模板引擎的實現

需求 根據不同狀態 state為1,2,3三種情況 即type 1 type 2 type 3這三種情況,分別將狀態不同時要展示的內容新增到介面上。做這個需求的時候,遇到的問題是,由於用的原生js寫的,所以需要操作dom 因此,我要判斷state,判斷以後,再建立新的節點,再將內容新增到節點,更要命...