这篇文章给大家介绍如何使用BaiduTemplate模板引擎，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。
成都创新互联公司主要从事成都网站设计、
做网站、网页设计、企业做网站、公司建网站等业务。立足成都服务晋安,十载网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:028-86922220
1、新建项目，asp.net 空Web应用程序
添加data,js,styles,templates文件夹，添加baiduTemplate.js,jquery.js,bootstrap.css
2、添加list.js脚本，代码如下
var data = {
"list": [
{
"col1": "行1",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行2",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行3",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行4",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行5",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行6",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行7",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
},
{
"col1": "行8",
"col2": "数据2",
"col3": "数据3",
"col4": "数据6",
"col5": "数据5",
"col6": "数据6"
}
]
};
var template = "templates/list.html";
$.ajax({
url: template,
dataType: "html",
success: function (val) {
$("#list").html(baidu.template(val, data));
}
});添加模板文件list.html，内容如下
| 列1 |
列2 |
列3 |
列4 |
列5 |
列6 |
<%for(var i = 0; i
| <%=item.col1%> |
<%=item.col2%> |
<%=item.col3%> |
<%=item.col4%> |
<%=item.col5%> |
<%=item.col6%> |
<%}%>
3、添加default.aspx页面，并添加引用
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="baiduTemplate.Default" %>
