腾讯前端js模板引擎artTemplate使用文档兼容ie6789各浏览器
腾讯前端js模板引擎artTemplate使用文档兼容ie6789各浏览器
腾讯前端js模板引擎artTemplate使用文档兼容ie6789各浏览器
说明介绍
artTemplate是一款基于js的模板解析引擎,兼容ie6+,谷歌,火狐等浏览器,可以说是兼容了市面上大部分的浏览器。所以,这个将是我们进行前端开发的利器。
它的解析是配合json数据,然后进行界面渲染。所以,我们需要有一定的json基础知识,并且,从服务器获取到的信息,也需要是json格式的。
为方便操作dom,后面的内容中,我们会引入jquery.js
引入template.js
引入线上的template.js
<script type="text/javascript" src="http://www.sjmoban.com/static/js/template.js"></script>
下载到本地,引用template.js
<script type="text/javascript" src="static/js/template.js"></script>
完整的html代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title> </head> <body> <!--listbox 存放解析后的html代码--> <div id="listbox"></div> <!--template模板--> <script type="text/html" id="template"> <%=msg%> </script> </body> </html> <script src="http://www.sjmoban.com/study/artTemplate/static/js/template.js"></script> <script> var data={ msg:"Hello World"//msg变量,可在模板中使用<%=msg%>调用 }; var html=template("template",data);//得到解析后的字符串 document.getElementById("listbox").innerHTML=html;//放到存放字符串的容器中 </script>
渲染结果(在ie6浏览器里面)
下一篇:
artTemplate的使用结构