主题
使用 EJS
EJS（Embedded JavaScript）是一个流行的 JavaScript 模板引擎，具有简单、灵活的模板语法，广泛应用于动态生成 HTML 内容。Express 可以非常方便地与 EJS 集成，快速渲染动态页面。
安装 EJS
首先，在你的项目中安装 EJS 模板引擎：
bash
npm install ejs配置 EJS
在 Express 应用中设置 EJS 作为模板引擎：
js
const express = require('express');
const path = require('path');
const app = express();
// 设置模板引擎为 EJS
app.set('view engine', 'ejs');
// 设置视图文件夹路径
app.set('views', path.join(__dirname, 'views'));
app.listen(3000, () => {
console.log('服务器启动在 http://localhost:3000');
});渲染 EJS 模板
使用 res.render() 方法渲染 EJS 模板，并传递数据到视图：
js
app.get('/', (req, res) => {
res.render('index', { title: 'Express 和 EJS' });
});创建 views/index.ejs 模板
在 views 文件夹中创建一个名为 index.ejs 的文件：
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title><%= title %></title>
</head>
<body>
<h1>欢迎来到 <%= title %> 网站！</h1>
</body>
</html>渲染结果
访问 http://localhost:3000 时，Express 会渲染 index.ejs 模板，并插入传递的数据，最终生成以下 HTML：
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Express 和 EJS</title>
</head>
<body>
<h1>欢迎来到 Express 和 EJS 网站！</h1>
</body>
</html>EJS 模板语法
EJS 提供了简洁的语法来嵌入 JavaScript 代码到 HTML 模板中：
输出变量
用 <%= %> 语法输出变量值：
html
<p>欢迎，<%= username %>!</p>控制结构
使用 <% %> 包裹 JavaScript 代码逻辑：
- if 条件判断：
html
<% if (user.isLoggedIn) { %>
<p>欢迎回来，<%= user.name %>!</p>
<% } else { %>
<p>请登录</p>
<% } %>- for 循环：
html
<ul>
<% items.forEach(item => { %>
<li><%= item.name %></li>
<% }) %>
</ul>代码注释
EJS 允许在模板中添加注释：
html
<%-- 这是一个注释 --%>传递复杂数据
可以传递对象、数组或嵌套数据结构到 EJS 模板：
js
app.get('/user/:id', (req, res) => {
const user = { id: req.params.id, name: '张三' };
res.render('profile', { user });
});模板 profile.ejs：
html
<h1>用户：<%= user.name %></h1>
<p>ID：<%= user.id %></p>处理表单数据
EJS 模板也可以用来处理和渲染表单：
html
<form action="/submit" method="POST">
<input type="text" name="username" />
<button type="submit">提交</button>
</form>在 app.js 中处理表单提交：
js
app.post('/submit', (req, res) => {
const username = req.body.username;
res.render('welcome', { username });
});总结
通过与 EJS 的集成，Express 应用可以动态渲染 HTML 内容，轻松实现数据和页面的结合。掌握 EJS 的基础用法后，可以更加灵活地开发动态 Web 应用。