【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的事情，可以先初步了解，无需硬背，需要用时再查对应方法就可以了~