前言
在 web 开发中，经常需要生成动态 HTML 页面，ejs 是一款 Node.js 的模板引擎，它简单易用、功能强大，被广泛应用于 web 开发中。本文将介绍如何使用 npm 包 @nathanfaucett/ejs 来使用 ejs 模板引擎。
安装
首先需要安装 Node.js 环境，在 Node.js 环境下使用 npm 包管理器安装 @nathanfaucett/ejs 包。
使用 npm 安装 @nathanfaucett/ejs：
npm install @nathanfaucett/ejs
基本使用
引入 @nathanfaucett/ejs 包，并使用 ejs.render() 方法进行渲染。
-- -------------------- ---- ------- ----- --- - ------------------------------ ----- -------- - - ------- ----- ------- ------ ------- ------ -- ----- ---- - - ------ ------ -------- -------- ----- -- -- ----- --- ------ - ----- ------ - -------------------- ------ --------------------
以上代码中，模板字符串 template 定义了一个 HTML 页面模板，并使用 ejs 的模板语法插入变量，使用 ejs.render() 方法将数据 data 替换模板中的变量，生成最终的 HTML 页面。
模板语法
输出变量
使用 <%= variable %> 输出变量的值，ejs 会自动将变量转义，避免 XSS 攻击：
<ul>
<% for(let i=0; i<list.length; i++) { %>
<li><%= list[i] %></li>
<% } %>
</ul>原样输出
使用 <%- variable %> 原样输出变量的值，不做转义，适用于输出 HTML 片段等：
<div> <%- html %> </div>
执行代码
使用 <% js code %> 执行 js 代码，适用于逻辑判断、循环等:
<% if (role === 'admin') { %>
Welcome, admin!
<% } else { %>
Access denied!
<% } %>包含文件
使用 <%- include('path/to/file') %> 包含本地文件，实现模板复用：
<%- include('header.ejs') %>
<main>
<h1><%= title %></h1>
<p><%= content %></p>
</main>
<%- include('footer.ejs') %>指定模板路径
默认情况下，使用 ejs 模板引擎时，模板文件需要和 js 文件在同一目录下，例如：
- project/ - index.js - index.ejs
如果模板文件不在同一目录下，需要使用 path 模块指定模板所在目录：
const path = require('path');
const templatePath = path.join(__dirname, './view/template.ejs');
const template = fs.readFileSync(templatePath, 'utf8');以上代码中，通过 path.join() 方法指定模板所在的绝对路径。
实例
下面是一个完整的使用示例，生成一个随机的六位数字验证码，渲染为 HTML 页面显示：
-- -------------------- ---- -------
----- --- - ------------------------------
----- ---- - ----------------
----- -------- - -
------
------
-------------- ------------
-------
------
----------- ----- --- ------- -------
---- ------------------------------ ------ ----
-------
-------
--
--------------------------- --------- -- -
----- ------- - ------------------------ - ------- - -------
----- ------ - ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
----- ---- - -
--------
------
--
----- ---- - -------------------- ------
----------------------- ---------------- --------------
-------------------
----------------访问 http://localhost:8080，即可看到渲染后的验证码页面。
总结
本文介绍了 npm 包 @nathanfaucett/ejs 的使用方法及其模板语法，希望对大家学习 ejs 模板引擎有所帮助。ejs 不仅仅可以在 Node.js 环境下使用，在浏览器中也可以使用，下一篇文章将介绍如何在浏览器中使用 ejs 模板引擎。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bcc967216659e244918