js学习总结----ejs模板引擎

我们都知道传统的发送ajax请求以后绑定html都是用拼接字符串的方式，这样开发效率低，并且js代码里面还有html代码。下面介绍一下ejs模板引擎

下面代码展示了ejs模板的基本用法

<script charset='utf-8' type='text/javascript' src='ejs.min.js'></script>
    <!--制作EJS渲染的模板:在原有的HTML结果基础上把我们的数据嵌套进来，EJS语法语法规定了我们需要编写的js代码写在<%%>即可，把需要输出的内容写在<%=%>-->
    <script charset='utf-8' type='text/template' id='conTemplate'>
        <%$.each(matchData,function(index,value){%>
            <li>
                <span><%=item.id%></span>
                <span><%=item.name%></span>
                <span><%=item.sex==1?'女':'男'%></span>
                <span><%=item.score%></span>
            </li>
        <%})%>
    </script>
    <script>    
        function bindHTML(data){
            //把我们的HTML结构script中制作的模板字符串拼接到
            var template = $('#conTemplate').html();
            //使用EJS中的RENDER向指定模板中提供需要的数据，EJS会把模板和字符串按照既定的规则进行解析渲染，最后得到的是数据和HTML结构拼接在一起的字符串
            var result = ejs.render(template,{matchData:data});
            //把拼接好的放入到页面的指定容器中
            $('.box').html(result);

        }
    </script>