模板引擎jsrender的简单入门

一、jsrender的简单介绍
jsrender是一个JS库，允许您定义一次样板结构并重复使用它来动态生成HTML。JsRender为HTML5开发带来了一个新的模板库，它具有无代码标记语法和高性能，支持创建自定义函数并使用纯粹的基于字符串的渲染。官网说他是“简单直观 功能强大 可扩展的 快如闪电”确实如此。
jsRender 的主要概念：模板、容器和数据。
优先使用场景：元素重复出现；动态加载数据，并前端显示；
官方网站 ：https://www.jsviews.com/#jsrender
二：基本语法，
•原始赋值： {{:属性名}}，显示原始数据
•转码赋值： {{>属性名}}，显示HTML编码后的数据，让数据原样输出
•控制语句可嵌套使用： ◦判断： {{if 表达式}} … {{else}} … {{/if}}
◦循环： {{for 数组}} … {{/for}}
三：基本使用方法
第一步 下载jsrender
第二步在页面上导入

<script src="../static/assets/vendors/jquery/jquery.js"></script>
<script src="../static/assets/vendors/jsrender/jsrender.js"></script>

第三步;在html页面中添加模板

<script id="comments_tmpl" type="text/x-jsrender">
        {{for comments}}
            <tr>
                <td>{{:#index}}</td>
                <td>{{:content}}</td>
            </tr>
        {{/for}}

</script>
<script>
    $(function ($) {
        $.post('/admin/api/commentsAll.php', {}, function (data) {
            console.log(data);
          var ht =  $("#comments_tmpl").render({comments: data});
          console.log(ht);

        }, 'json');
    })

在html的效果：