一个很简易的javascript模板引擎
忘记在哪里看到的了,在这里记录一下,供自己平时使用。一个很简单的JavaScript模板引擎,算是能提现模板引擎的原理吧。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/tempalte" id="tmpl">
我叫<% name %>,我<% age %>岁,我在 <% school %>上学
</script>
<script type="text/javascript">
//创建对象
var obj = {
"name": "张三",
"age": 18,
"school": "蓝翔技校"
}
// 把上面的obj中的数据绑定到tmpl中,输出完整的一句话
// 正则 认识<% value %>格式
var reg = /<%\s*([^%>]\S+)\s*%>/;
function tempalte(id, obj) {
var html = document.getElementById(id).innerHTML;
var _exec = null;//初始化
while (_exec = (reg.exec(html))) {
html = html.replace(_exec[0], obj[_exec[1]]);
}
return html;
}
document.write(tempalte('tmpl', obj))
</script>
</body>
</html>