$(function() {
var data = [{
id: 1,
name: "张三",
sex: "男",
age: 20
},
{
id: 2,
name: "李四",
sex: "男",
age: 25
},
{
id: 3,
name: "赵雪",
sex: "女",
age: 18
},
{
id: 4,
name: "王五",
sex: "男",
age: 32
}
];
// 调用绘制表格
initUserInfo(data);
});
function initUserInfo(data) {
// 定义正则
var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
// 拼接代码缓存
var source = "";
// 获取模板代码
var html = $("#userInfoTemp").html();
// 遍历数据
$.each(data, function() {
// 当前遍历对象
var _this = this;
// 替换对象
source += html.replace(reg, function(node, key) {
return _this[key] || "";
});
});
// 绘制表格
$("#userInfo").html(source);
}