ejs模板

最新推荐文章于 2024-05-11 09:34:25 发布

older-black

最新推荐文章于 2024-05-11 09:34:25 发布

阅读量1.1k

点赞数 1

文章标签：服务器前端 java

本文链接：https://blog.csdn.net/weixin_48879122/article/details/126699264

版权

1.ejs模板简述

ejs等模板语法的优点是动态的根据数据渲染页面；让html与前端页面数据分离；

服务器用这类模板使用数据动态的将页面渲染好，然后将响应返回给前端页面，减少页面加载时间；

2.模板下载

2.1.建立项目文件夹，该文件夹下的public放静态资源；views放前端页面模板；

2.2 后端代码

使用第三方模块 ejs

var express = require("express");
var app = express()
app.use(express.static("public"));
app.listen(5000)
// 1,下载安装ejs模块 npm i ejs
// 2.导入ejs模块
var ejs =require("ejs");
// 3.设置模板引擎 第一个参数是模板引擎  第二个参数是模板模块
app.set("view engine",ejs);

app.get("/next.html",function(req,res){
    res.render("demo.ejs",{
        title:"demo",
        array:["数组1","数组2","数组3"]
    })

})

2.3 ejs模板的基础语法

注意ejs模板的模板文件在views中的后缀是 .ejs；

<!-- 单个变量 -->
        <%= title %>

        <!-- for循环语句 -->
        <ul>
            <% array.forEach(function(item,index){%>
                <li>
                <%= item %> -----<%= index+1 %>
                </li>
            <%})%>
        </ul>

        <!-- if判断语句 -->
        <% if(title=="样本" ){%>
            <h1>这是样本页</h1>

            <%}else{%>
            <h1>这不是小样页</h1>
        <%}%>

总结ejs模板渲染语法

1. < %=1% > 中间是没有空格的之所以在注释中加空格是因为注释中的ejs也会被执行

2. < % = % > 用于渲染变量支持简单的逻辑运算

3. < % 任意js代码逻辑 % > 用于执行一句js逻辑不支持换行

3.与art的异同

3.1 模板文件的格式不同；

3.2 基础语法不同

3.3 都是同一类编程思想