js-ejs 是一个用于 JavaScript 的模板引擎，支持模板文件中使用 JavaScript 代码，并将模板文件转换为字符串输出。在前端开发中，使用模板引擎可以使 HTML 页面和 JavaScript 逻辑分离，提高可维护性和代码的复用性。
安装
安装 js-ejs 可以通过 npm 进行安装：
npm install js-ejs
使用
基本使用
使用 js-ejs 的基本步骤如下：
引入
ejs模块：const ejs = require('js-ejs');调用
ejs.render方法将模板文件编译成字符串：-- -------------------- ---- ------- ----- -------- - - ---- -- ------- ---- ---------------- ---- - -- ------- --------- ------- -- - -- ----- -- ----- ---- - - ------- --------- --------- --------- -- ----- ---- - -------------------- ------ ------------------输出结果为：
<ul> <li>apple</li> <li>banana</li> <li>orange</li> </ul>
模板语法
js-ejs 支持以下模板语法：
输出变量
使用 <%= variable %> 输出变量值：
<p><%= name %></p>
条件语句
<% if (condition) { %>
<!-- code to execute when condition is true -->
<% } else { %>
<!-- code to execute when condition is false -->
<% } %>循环语句
<ul>
<% for (let i = 0; i < items.length; i++) { %>
<li><%= items[i] %></li>
<% } %>
</ul>自定义函数
<% function myFunction(arg) { %>
<!-- code to execute -->
<% } %>
<!-- call the function -->
<% myFunction('argument') %>高级用法
js-ejs 还支持以下高级用法：
自定义标签
可以通过 ejs.delimiter 属性自定义标签的开始和结束符号，默认为 <% 和 %>：
-- -------------------- ---- -------
------------- - ----
----- -------- - -
----
- ------- ---- ---------------- ---- - -
------ --------- ------
- - -
-----
--
----- ---- - - ------- --------- --------- --------- --
----- ---- - -------------------- ------
------------------输出结果与基本使用相同，不再赘述。
包含子模板
可以使用 <%- include('path/to/template.ejs') %> 包含其他模板文件，这样可以将公共部分抽离出来，提高代码的复用性：
-- -------------------- ---- -------
--------- -----
------
------
---------- ----- ----------
-------
------
--- ------------------------------ --
------
--- ------- --
-------
--- ------------------------------ --
-------
-------自定义过滤器
可以通过 ejs.filters 对输出结果进行自定义过滤，例如对日期格式化：
-- -------------------- ---- ------- ---------------------- - -------------- - ------ --- -------------------------------- -- ----- -------- - - -------- -- --- ---- - ---------- ------- -- ----- ---- - - ----- ---------- -- ----- ---- - -------------------- ------ ------------------
输出结果为：
<p>Today is 4/7/2023.</p>
总结
以上就是使用 js-ejs 的基本步骤和常用语法。使用模板引擎可以使前端开发更加高效和便捷，同时也需要
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/54068