EJS：传统而强大的 Javascript 模板引擎

什么是 EJS？

EJS (Embedded JavaScript Templating) 是一个基于 JavaScript 的简单、快速且高效的模板引擎。它允许您将数据和模板混合在一起，生成需要的 HTML 文件。EJS 是一种传统的模板语言，其设计基于简单易懂的技术，与 JavaScript 非常相似。

EJS 的主要特点包括：

• 基于 JavaScript 语法，易于学习和使用。
• 可以与任何 JavaScript 框架和库集成。
• 支持客户端和服务器端渲染。
• 具有强大的逻辑控制和数据循环功能。
• 非常灵活，可以通过自定义标记和过滤器进行扩展。

安装和使用

安装 EJS 非常简单，只需要在您的项目中运行以下命令：

npm install ejs --save

如上所示，您需要使用 Node.js 包管理器 (npm) 来安装 EJS，并将其保存为您的项目的依赖项。

在安装完成后，您可以通过以下方式来使用 EJS：

const ejs = require('ejs');

// 渲染视图
ejs.renderFile('views/index.ejs', {title: 'EJS Demo'}, {}, (err, html) => {
  if (err) {
    console.log(err);
  } else {
    console.log(html);
  }
});

在上述示例中，我们首先使用 renderFile() 方法来渲染包含模板的视图。第一个参数是视图的路径，第二个参数是要传递给模板的数据。第三个参数是用于设置选项的对象，这里我们不需要使用任何选项。最后，我们使用回调函数来处理渲染结果。

模板语法

EJS 模板使用一种简单而直观的语法来声明和处理 HTML 元素和数据。下面是一些常用的 EJS 语法：

输出变量值

您可以在 EJS 模板中使用以下语法来输出一个变量的值：

<h1><%= title %></h1>

如上所示，我们使用 <%= %> 标记来声明要输出的变量名称。在渲染完成后，变量的值将被替换为 HTML 元素。

JavaScript 代码

在 EJS 模板中，您可以使用 <% %> 标记将任意 JavaScript 代码嵌入到模板中：

<% for (let i = 0; i < items.length; i++) { %>
  <li><%= items[i] %></li>
<% } %>

如上所示，我们使用 <% %> 标记将 for 循环添加到模板中，并使用 <%= %> 标记将数组元素插入到 HTML 中。

条件语句

在 EJS 模板中，您可以使用以下语法来声明条件语句：

<% if (loggedIn) { %>
  <button>Logout</button>
<% } else { %>
  <button>Login</button>
<% } %>

如上所示，我们使用 <% %> 标记将条件语句嵌入到模板中，根据代码逻辑决定要显示的元素。

循环语句

在 EJS 模板中，您可以使用以下语法来声明循环语句：

<ul>
  <% for (let i = 0; i < items.length; i++) { %>
    <li><%= items[i] %></li>
  <% } %>
</ul>

如上所示，我们使用 <% %> 标记将循环语句添加到模板中，并使用 <%= %> 标记将数组元素插入到 HTML 中。

总结

EJS 是一个传统而强大的 JavaScript 模板引擎，它允许您将数据和模板混合在一起，生成需要的 HTML 文件。使用 EJS，您可以轻松地创建动态和交互式的网页，而不必关心复杂的前端开发问题。如果您正在寻找一个灵活、易于学习和使用的模板引擎，那么 EJS 绝对是一个不错的选择。