本次将介绍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模板引擎框架的使用的高级篇
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
