模板引擎
模板引擎的介绍
页面渲染使用字符串拼接 会存在问题 : 字符的恒定性 字符串拼接的时候容易出错
模板引擎不用拼接字符串 直接使用 静态页面里面的html里面的结构生成模板 需要渲染的时候直接调用
模板引擎的实现方式有很多,最简单的是“置换型”模板引擎,这类模板引擎只是将指定模板内容(字符串)中的特定标记(子字符串)替换一下便生成了最终需要的业务数据(比如网页)。
模板引擎的使用步骤
- 导入模板引擎
- 准备一个模板
2.1. 准备模板必须要是用script 模板引擎规定的只能使用script
2.2. 必须要给他一个id 在调用方法的时候使用
2.3. 必须要有type属性 而且type属性绝对绝对不能使text/javascript
- 调用方法 生成html结构
模板引擎使用的注意点:
- 代入的时候 一定要注意 代入的名字一定要和对象的属性名一直
- type的值只要不是text/javascript 但是建议使用text/html 因为其他的没办法识别标签
- <%= %> 必须是一个完整的整体 不能加空格 或者其他的符号
var stu = {
name : "lisa",
age : 18
}
var html = template("tpl", stu);
模板引擎的简写方式
.导入引擎模板
<script src="./js/template-web.js"></script>
2.准备模板
{
{
each list value }}
<tr>
<td>{
{
value.Id }}</td>
<td>{
{
value.name }}</td>
<!-- <td>{
{
value.age }}</td> -->
{
{
if value.age >= 18}}
<td>成年