模板渲染:根据模板来渲染数据!!!在ES6 中模板字符串用反引号表示。
let str = 我是字符串
;
下面进入正题:
我们先自己创建一个模板:
<script type="text/html" id="template">
<ul>
<% for(var i = 0 ; i < 10 ; i ++){ %>
<li>
<strong> <%= i %></strong>
</li>
<% } %>
</ul>
</script>
注意点:
1、因为模板里肯定包含js,所以我们对js特殊标记:<%这里边写js%>
2、HTML在我们眼中就是字符串,所以不用包裹
3、输出的变量,我们用<%=%>包裹
接下来:
先处理HTML标签:
自定义一个print方法用来拼接标签。
再处理js代码的包裹以及特殊的输出的变量的包裹:
这里我们使用正则处理:
HTML标签处理的正则:
/<%^=%>/g
输出变量处理的正则:
/<%=(.*?)%>/g