JS模板引擎-baiduTemplate下载和文档http://www.lrxin.com/archives-824.h

下载和文档

www.lrxin.com/archives-82…

将baiduTemplate.js放在您的工作目录下

helloworld程序

<!Doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>

<!-- 引入baiduTemplate -->
<script type="text/javascript" src="./baiduTemplate.js"></script>

</head>
<body>
<div id='result'></div>
<!-- 模板1开始，可以使用script（type设置为text/html）来存放模板片段，并且用id标示 -->
<script id="t:_1234-abcd-1" type="text/html">
<div>
    hello:<%=hello%></h1>    
</div>  
</script>
<!-- 模板1结束 -->

<!-- 使用模板 -->
<script type="text/javascript">
var data={
    "hello":'world'
};

//使用baidu.template命名空间
var bt=baidu.template;
var html=bt('t:_1234-abcd-1',data);

//渲染
document.getElementById('result').innerHTML=html;
</script>

</body>
</html>

运行结果：

hello:world

if示例

<!Doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>

<!-- 引入baiduTemplate -->
<script type="text/javascript" src="./baiduTemplate.js"></script>

</head>
<body>

<div id='result'></div>
<!-- 模板1开始，可以使用script（type设置为text/html）来存放模板片段，并且用id标示 -->
<script id="t:_1234-abcd-1" type="text/html">
<div>
    
    <% if(language == "cn") { %>
    hello:<%=hello%></h1>   
    <% }else{ %>
    hello:<%=你好%></h1>    
    <% }%>   
</div>  
</script>
<!-- 模板1结束 -->

<!-- 使用模板 -->
<script type="text/javascript">

var data={
    "hello":'world',
    "你好":"世界",
    "language":"en"
};

//使用baidu.template命名空间
var bt=baidu.template;
var html=bt('t:_1234-abcd-1',data);

//渲染
document.getElementById('result').innerHTML=html;
</script>

</body>
</html>

运行结果：

hello:世界

for示例

<!Doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>

<!-- 引入baiduTemplate -->
<script type="text/javascript" src="./baiduTemplate.js"></script>

</head>
<body>

<div id='result'></div>
<!-- 模板1开始，可以使用script（type设置为text/html）来存放模板片段，并且用id标示 -->
<script id="t:_1234-abcd-1" type="text/html">
<div>
        <%for(var i=0;i<languagePackage.length;i++){
             if(languagePackage[i] == "en") { %>
                hello:<%=hello%></h1>   
                <% }else{ %>
                hello:<%=你好%></h1>    
                <% } 
        }%> 
 </div>  
</script>
<!-- 模板1结束 -->

<!-- 使用模板 -->
<script type="text/javascript">

var data={
    "hello":'world',
    "你好":"世界",
    "languagePackage":["en","cn"]
};

//使用baidu.template命名空间
var bt=baidu.template;
var html=bt('t:_1234-abcd-1',data);

//渲染
document.getElementById('result').innerHTML=html;
</script>

</body>
</html>

运行结果：

hello:world hello:世界