22. EJS（嵌入式 JavaScript）
发布: (2026年4月30日 GMT+8 23:36)
2 分钟阅读
原文: Dev.to
Source: Dev.to
什么是 EJS？
EJS（Embedded JavaScript）是 Node.js 的模板引擎。
关键概念
- 模板化 – 使用 JavaScript 生成动态 HTML。
- 关注点分离 – 前端（HTML、CSS） 与 后端（JavaScript）。
- 其他模板语言 – Python（Jinja）、PHP（Twig）、JavaScript（EJS）。
- EJS 工作原理 – JavaScript 在 HTML 中运行；“ 输出数据到页面。
使用 Express 渲染
静态文件
res.sendFile("index.html");动态（EJS）文件
app.post("/submit", (req, res) => {
res.render("index.ejs", {
name: req.body["name"]
});
});
## Hello
EJS 标签
| 标签 | 描述 |
|---|---|
| “ | 输出值（已转义）。 |
| “ | 执行 JavaScript（无输出）。 |
| “ | 渲染原始 HTML（未转义）。 |
| “ | 字面显示 “。 |
| “ | 注释 – 不会执行。 |
| “ | 包含局部模板（例如 header、footer）。 |
传递数据
- 服务器 → EJS – 通过
res.render()传递数据。 - EJS → 服务器 – 使用
method="POST"的表单将数据发送回去。
// 示例：渲染并传递数据
app.get("/", (req, res) => {
res.render("index.ejs", { title: "Home", items: ["A", "B", "C"] });
});如果未提供数据，可使用默认值或 app.locals。
局部模板 & 布局
// 提供静态资源
app.use(express.static("public"));模板语法回顾
- “ – 逻辑 / 控制流。
- “ – 转义输出。
- “ – 未转义（原始）输出。
使用局部模板
局部模板有助于避免代码重复并提升可维护性。
JavaScript 小技巧
变量声明
const– 不能重新赋值。let– 可以重新赋值。
数组遍历
array.forEach((element, index, array) => {
// 在此编写代码
});