2013
12
09

HTML 版型工具

關鍵字:HTML5JsRenderjqueryJSONTemplates

隨著AJAX技術的使用,目前程式開發人員越來越多人使用AJAX來與後端的系統交流,並進而將取的資料(如JSON),轉換成前台的HTML CODE,但該如何將資料轉換成HTML的畫面,在過去你可能是使用字串相加取得結果,如果你所需要的HTML是一個簡單表格之類的,或許你還可以這樣處理,但如果你需要的是將資料轉換成一些複雜的畫面與結果甚至是一些JS程式碼時,也許你該試試-JsRender

JsRender 是一個JavaScript函式庫,可以一次定義一個樣板檔結構,並使用它來動態地生成 HTML一個簡單的範例,在HTML先行定義一個樣版

<script id="myMovieTemplate" type="text/x-jsrender ">
<div>{{:#index+1}}: {{:name}} ({{:releaseYear}})</div>
</script>

呼叫樣板,並渲染畫面出來,下面使用了一些jQuery的語法,但JsRender並不依賴於jQuery

$("#movieContainer").html($("#myMovieTemplate").render(my.vm.movies));

採用 JsRender可以將你的網頁程式架構,變得更加具有可讀性,同時也加速開發的速度,如果想知道更多的細節可以參訪下面的網址
http://www.jsviews.com/#jsrender
傑立資訊傑立資訊事業有限公司

電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:service@julyinfo.com | 臺北市大安區和平東路3段257號6樓map

© 2016 傑立資訊 All rights reserved.法律顧問:宇恒法律事務所