ajax里使用模板引擎
Posted 澎湃_L
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ajax里使用模板引擎相关的知识，希望对你有一定的参考价值。
一、概述：
- 处理响应数据渲染可以使用模板引擎（实际上就是一个API，目的是更容易的将数据渲染到html中）
- 目前市面上有许多模板引擎，可以参考
- 推荐使用artTemplate，它采用作用域预声明的技术来优化模板渲染速度，同时支持 NodeJS 和浏览器。
二、模板引擎步骤：
①选择一个模板引擎，下载模板引擎文件
②引入到页面中
③准备一个模板
④准备一个数据
⑤通过模板引擎的js提供的一个函数将模板和数据整合得到渲染结果HTML
⑥将渲染结果的HTML设置到默认元素的innerHTML中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p id="p"></p> <script src="lib/template-web.js"></script> <script type="text/template" id="tpl"> 我叫 {{name}} 我来自 {{provices}} 我的爱好是 {{each hobbies}} {{$value}} {{/each}} </script> <script> var data={ name:\'eric\', provices:\'江西\', hobbies:[\'代码\',\'运动\',\'电脑游戏\'] } var ret=template(\'tpl\',data); var p=document.getElementById(\'p\'); p.innerHTML=ret; </script> </body> </html>
三、模板写入script的原因
- 如果写入到JS变量中，维护不方便，不能换行，没有着色
- 写入到script标签中，innerHTML不会显示在界面上
- 注意：script标签里如果type类型不是text/javascript，标签内容不会安装js文件执行
四、参考:JavaScript模板引擎实例应用
以上是关于ajax里使用模板引擎的主要内容，如果未能解决你的问题，请参考以下文章