标签：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>MyHtml.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script src="${base}/js/jquery1.11.min.js"></script> <script src="${base}/js/crox.js"></script> </head> <body> <textarea id="tpl" style=‘display:none‘> 转义取值: <p> <!--输出 html 转义 的 expr 的值。 --> A: {{‘a b\tc‘}} - B: {{root.bb}} </p> 取值: <p> <!--直接输出 expr 的值。 --> A: {{{true}}} - B: {{{root.bb}}} </p> 原本值: <p> <!--不进行翻译。 --> "{{#raw}}{{root.bb}}{{/raw}}" </p> set赋值: <p> <!--声明一个变量 id， 并赋值。 --> {{set c = root.c}} D: {{c.d}} E: {{root.e}} </p> if判断: <p>{{#if root.e > root.a + 1 }} E > A + 1 {{else}} E <= A + 1 {{/if}}</p> 遍历对象: <p> <!--两个 string 会声明一个名字为其值的变量，第一个表示 值，第二个表示 索引 (可选)。 --> {{#forin root ‘val2‘ ‘index‘}} {{index}} => {{val2}} {{/forin}} </p> 遍历数组: <p> <!--两个 string 会声明一个名字为其值的变量，第一个表示 值，第二个表示 索引 (可选)。 --> {{#each root.list ‘val2‘ ‘index‘}} {{index}} => {{val2}} {{/each}} </p> 直接调用js函数或方法: <p>{{alert(root.bb.toUpperCase())}}</p> <p>{{empty(root.ee,‘amIurs发现新大陆!‘)}}</p> </textarea> </body> <script type="text/javascript"> var tmpl = $(‘#tpl‘).text(); var data = {a: 1 , b: 2 , bb: ‘a b\tc‘ , c: {d: 3 } , e: 1 , ee: ‘‘ , f: true , ff: null , list: [‘a‘ , ‘b‘ , ‘c‘] }; var result = Crox.render(tmpl , data);//将数据 填充到模板 $(‘#tpl‘).before(result); function empty(str , val) { return str.length > 0 && str != ‘‘ ? str : val; } </script> </html>
标签：
原文地址：http://www.cnblogs.com/gcg0036/p/4307444.html
