template-web.js模板引擎的使用之初级篇
邢皓
本次将介绍web前端模板引擎框架之一的template-web.js模板引擎框架的使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--
引入模板引擎:一般用于在网络请求之后，展示相同的多条数据
-->
<script type="text/javascript" src="js/template-web.js" ></script>
<!--定义模板-->
<script type="text/html" id="personTemplate">
<ul>
<li>姓名{{name}}</li>
<li>性别{{sex}}</li>
<li>年龄{{age}}</li>
</ul>
</script>
<script type="text/javascript">
//定义数据
var personData = {
name:"刘强",
sex:"男",
age:23
};
/**
* 利用模板引擎 引用数据填充到模板中
*
* 参数一：模板id
* 参数二：数据
*/
var result = template("personTemplate",personData);
//将返回的模板结果添加到界面中
document.body.innerHTML = result;
</script>
</body>
</html>下一篇为template-web.js模板引擎框架的使用的高级篇
类似资料：