EJS模板引擎

概述

　　EJS是一个简单高效的模板语言，通过数据和模板，可以生成HTML标记文本。可以说EJS是一个JavaScript库，EJS可以同时运行在客户端和服务器端，客户端安装直接引入文件即可，服务器端用npm包安装

特点

　　1、快速编译和渲染

　　2、简单的模板标签

　　3、自定义标记分隔符

　　4、支持文本包含

　　5、支持浏览器端和服务器端

　　6、模板静态缓存

　　7、支持express视图系统

安装与使用

　　终端执行：

　　　　npm install ejs 进行安装

　　使用：

js文件

//引入express
const express = require('express')

//1.创建app服务对象
const app = express()

// 让你的服务器知道你在哪一个模板引擎----配置模板引擎
app.set('view engine','ejs')
//让你的服务器知道你的模板在哪个目录下，配置模板目录
app.set('views','./haha')

//如果在express中基于Node搭建的服务器，使用ejs无需引入，
app.get('/show',function (request,response){

    // response.render('person',{data:'<h1>hello,老三</h1>'})
    let personArr=[
        {name:'peiqi',age:4},
        {name:'qiuaozhi',age:3},
        {name:'peiudeluo',age:5},
    ]
    response.render('person',{persons:personArr})
})

app.listen(3001,function(err){
    if(!err) console.log('服务器启动成功了')
    else console.log(err)
})

　　

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>show</title>
</head>
<body>
<!--
        ejs语法：
            1.< % % >里面能写任意js代码，但是不会向浏览器输出任何东西
            2.< %- % >能够将后端传递过来对象指定kay所对应的value渲染的页面
            3.< %= % >能够将后端传递过来对象指定kay所对应的value渲染的页面

-->
<!--<div>< %-data% ></div>-->
<!--<div>< %=data% ></div>-->
<%
    for(var i=0;i<persons.length;i++){
        let item = persons[i] %>
        <ul>
            <li>姓名：<%=item.name%></li>
            <li>姓名：<%=item.age%></li>

        </ul>
    <%}%>
</body>
</html>

 

前后端不分离-------浏览器所看到的页面，是由服务器渲染的

 

posted @ 2022-08-04 14:08  罗砂  阅读(135)  评论(0)    收藏  举报