EJS 是一种简单的 JavaScript 模板引擎，用于将数据呈现为 HTML 页面。它易于使用、可扩展，并且与 Node.js 和 Express.js 兼容。在此篇文章中，我们将探讨如何在 Node.js 和 Express.js 中使用 EJS 模板引擎。
为什么要使用 EJS？
EJS 是一种强大的模板引擎，它允许您在页面上动态呈现数据。与直接将 HTML 代码嵌入 JavaScript 代码中相比，使用模板引擎有以下优点：
- 分离了数据和界面层，使得代码更具可维护性和可读性。
- 仅需更新数据，而不必考虑如何更改 HTML，从而提高了开发效率。
- 可以方便地重用相同的 HTML 片段，使得页面更加可复用性。
安装 EJS
要在 Node.js 和 Express.js 中使用 EJS，首先需要安装 EJS 模板引擎。我们可以通过以下命令来完成安装：
npm install ejs
在 Express.js 中使用 EJS
在 Express.js 中使用 EJS 非常简单。我们只需要在 app.js 文件的顶部中添加以下行：
const ejs = require('ejs');
app.set('view engine', 'ejs');上述代码中，我们首先要求引入 EJS 模块，然后将 EJS 指定为 Express.js 应用程序的视图引擎。
对于如何结合路由和视图继续使用 EJS，下面将通过一个简单的 Express 应用程序来进行演示。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ---------------
----- --- - ----------
---------------- --------- - ----------
------------- -------- -------
-------------------------------- - ------------
------------ -------- ----- ---- -
------------------- -
------ ---- ------
-------- ----- ---------- --- --- ------
---
---
---------------- -------- -- -
-------------------- ------ --------- -- ---- -------
---在上述代码中，我们首先引入了必需的库，并将 EJS 模板引擎指定为 Express.js 应用程序的视图引擎。然后，我们设置了要使用的视图目录和静态文件目录。
在这个示例应用程序中，我们定义了一个 / 路径，该路径呈现名为 index.ejs 的 HTML 文件。我们将在呈现过程中提供要在页面中映射的数据。
Express.js 在访问路由时将渲染 EJS 文件。完整的视图模板指定了要在呈现过程中使用的 HTML 和数据格式。在此之后，EJS 引擎将在呈现过程中读取 HTML 模板并将数据应用于该模板。这将生成一个动态生成的 HTML，每个用户请求的页面都将根据用户请求的特定数据而自动生成。
下面是 views/index.ejs 文件的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
---------- ----- ----------
-------
------
------- ------- -------
-------
-------EJS 有一个特殊的标记，用于指定要在视图中生成的数据。这个标记是 <%= %>，它用于指示模板引擎在呈现 HTML 前插入数据。在上面的代码中，我们在第 7 行使用了这个标记来打印 title 和 message 变量中的数据。
总结
使用 EJS 模板引擎使得页面呈现更加动态化，并且能够更加轻松地管理数据和 HTML。通过该文档，我们已经学习了如何在 Node.js 和 Express.js 中使用 EJS 模板引擎。此外，我们还提供了演示如何使用 EJS 的示例代码。
希望您能够根据此文档开始进一步尝试使用 EJS 模板引擎，提高您的前端开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64765d17968c7c53b0325500