javascript 模板系統 （轉）

iDotNetSpace發表於2010-08-12
JavaScript

由於各種原因，被逼使用前臺模板。看了一下其他JS模板庫的實現，發現其原理並不難，遂決定重造輪子。使用ROR.erb風格。換言之，邏輯是寫在""之間，如果是註釋，則用""，凡是後臺傳過來的變數都加上@來標記。現在這個模板系統還沒有搭載任何helper方法，也不依賴任何程式碼，因此非常精短。

<html>
    <head>
        <meta charset="utf-8"/>
        <meta content="IE=8" http-equiv="X-UA-Compatible"/>
        <meta name="keywords" content="javascript模板 by 司徒正美" />
        <meta name="description" content="javascript模板 by 司徒正美" />
        <title>javascript模板 by 司徒正美title>
    head>
    <body>
        <h1>javascript模板 by 司徒正美h1>
        <textarea id="tmpl" style="display:none;" >
        <h2>h2>
        
        <ul>
        
            <li>li>
        
        ul>
        <p style="text-indent:2em;">p>
        textarea>
        <script src="http://files.cnblogs.com/rubylouvre/tmpl.js">script>
        <script>
            window.onload = function(){
                dom.erb("tmpl", {name:"司徒正美",supplies:["第一個LI元素","第二個LI元素","第三個LI元素","第四個LI元素"],address:"異次元"})
            }
        script>
    body>
html>

模板系統：

javascript模板 by 司徒正美

javascript模板 by 司徒正美

執行程式碼

PS:發現javascript模板沒有想象中的糟糕，尤其是大流量的頁面在無法使用UI庫的情況下，這是個不錯的選擇，例子如qq zone與ニコニコ動畫。

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/12639172/viewspace-670847/，如需轉載，請註明出處，否則將追究法律責任。

相關文章