标签:ext 3.3 操作 nload 引入 value dom logs json
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>使用 artTemplate模板</title> <!-- 第一步:引入artTemplate模板引擎 --> <script src="/js/template.js"></script> <style> .on{color:#f00;} </style> </head> <body> <div id="box1"></div> <!-- 第二步:编写模板 --> <!-- 模板的写法: <script id="模板ID值" type="声明代码的类型是模板"> </script> 注意: 模板使用的是 script标签,必须要有两个属性: id type --> <script id="mytmpl" type="text/html"> <h1>{{title}}</h1> {{each list}} <p class="on">{{$value}}</p> {{/each}} </script> <script> window.onload=function(){ /* * 第三步:渲染模板 * 3.1 获得数据 * 通过AJAX或者自定义,必须是 JSON数据 * * 3.2 渲染模板 * var html=template(‘模板ID‘,JSON数据); * * 3.3 DOM操作将结果显示在页面上 * box1.innerHTML=html; */ var data={title:‘今天我中500万了‘,list: [‘文艺‘, ‘博客‘, ‘摄影‘, ‘电影‘, ‘民谣‘, ‘旅行‘, ‘吉他‘]}; var html=template(‘mytmpl‘,data); box1.innerHTML=html; } </script> </body> </html>
标签:ext 3.3 操作 nload 引入 value dom logs json
原文地址:http://www.cnblogs.com/lylooooo/p/6879893.html