模板引擎的基本概念

4、模板引擎的基本概念

4.1、渲染UI结构时遇到的问题

var rows = []
$.each(e.data, function (i, item) {
   var str = '<li class="list-group-item"><span class="badge" style = "background-color: #f0ad4e;" > 评论时间:' + item.time + ' </span> <span class="badge" style="background-color: #5Bc0DE;">评论人:' + item.username + ' </span>' + item.content + '</li > '
   rows.push(str)
 })
$('#cmt-list').empty().append(rows.join(''))

上边的代码通过字符串拼接的形式，来渲染UI结构

如果UI结构比较负载，则需要格外的注意引号之前的嵌套，其一旦发生变化，修改非常麻烦

4.2、什么是模板引擎

模板引擎，顾名思义，它可以根据程序员指定的模板结构和数据，自动生成一个完整的HTML页在

4.3、模板引擎的好处

1、减少了字符串的拼接操作

2、使代码结构更清晰

3、使代码更易于阅读与维护