【EJS】JavaScript 模板引擎

#EJS 是一套简单的模板语言，帮你利用普通的 JavaScript 代码生成 HTML 页面。#

模板引擎

分离用户界面（html）和业务数据（js）

EJS

EJS 是一套简单的模板语言，帮你利用普通的 JavaScript 代码生成 HTML 页面。

官网：EJS -- 嵌入式 JavaScript 模板引擎 | EJS 中文文档

使用非常通俗易懂

用法

模板界面

<% js执行部分 %>

<%= 替换值 %>

业务数据

ejs.render(html, data);

例子

1.直接替换数据

const ejs = require('ejs');
const list = ['first', 'second', 'third'];
let html = `
    <ul>
        <% list.forEach(el => { %>
            <li><%= el %></li>
        <% })%>
    </ul>
`;
let result = ejs.render(html, { list });
console.log(result);
/**
 *  <ul>

            <li>first</li>

            <li>second</li>

            <li>third</li>

    </ul>
 */

2.文件分离管理读取

模板文件另存整理到一个文件夹里，需保存为ejs后缀，此处结合使用express框架的参考例子

const express = require('express');
const path = require('path');

const app = express();

// 1.设置模板引擎
app.set('view engine', 'ejs');

// 2.设置模板存放位置
app.set('views', path.resolve(__dirname, '/views'));

app.get('/home', (req, res) => {
    // 读取 /views/home 模板文件
    res.render('home', { data: 'hello' });
})

app.listen(3000, () => {});

其实，ejs内容不多，可直接看官网文档，就几个API的事情，可以先初步了解，无需硬背，需要用时再查对应方法就可以了~