EJS模板引擎语法详解：从基础到高级用法

EJS模板引擎语法详解：从基础到高级用法

ejs Embedded JavaScript templates -- http://ejs.co 项目地址: https://gitcode.com/gh_mirrors/ej/ejs

前言

EJS(Embedded JavaScript templates)是一款流行的JavaScript模板引擎，它以简洁的语法和强大的功能著称。本文将全面解析EJS的语法结构，帮助开发者掌握这一工具的核心用法。

EJS基础结构

EJS模板的基本单位是"标签"(tag)，其通用格式为：

<起始标记 内容 结束标记>

虽然标记间的空格不是必须的，但为了提高可读性，建议保留适当的空格。

分隔符(Delimiters)

EJS默认使用百分号%作为分隔符，但开发者可以根据需要自定义分隔符。例如：

const ejs = require('ejs');
ejs.delimiter = '$'; // 将分隔符改为$

起始标记详解

1. 转义输出 <%=

这是最常用的标记，用于输出经过HTML转义的内容：

<p>用户名: <%= username %></p>

如果username包含<script>等特殊字符，会自动转义为<script>，有效防止跨站脚本攻击。

2. 非转义输出 <%-

当需要输出原始HTML内容时使用此标记：

<div><%- rawHTML %></div>

安全提示：使用此标记前必须确保内容已完全净化，否则可能导致安全问题。

3. 注释 <%#

用于添加模板注释，不会出现在最终输出中：

<%# 这是一个不会被渲染的注释 %>

4. 脚本标记 <%

允许在模板中嵌入任意JavaScript代码：

<% 
const now = new Date();
const hour = now.getHours();
%>

最佳实践：

• 在条件语句和循环中始终使用大括号
• 保持代码整洁，适当添加注释
• 避免在单个标记中拆分完整表达式

5. 去除前导空白的脚本标记 <%_

与普通脚本标记功能相同，但会删除标记前的所有空白字符：

<div>
  <%_ const name = "John" _%>
</div>

结束标记详解

1. 标准结束标记 %>

<% if (condition) { %>
  内容
<% } %>

2. 去除换行的结束标记 -%>

删除标记后的换行符：

<ul>
<% items.forEach(function(item) { -%>
  <li><%= item %></li>
<% }); -%>
</ul>

3. 去除所有后续空白的结束标记 _%>

删除标记后的所有空白字符：

<div><%_ const x = 1 _%>内容</div>

字面量标记

要输出<%或%>本身，使用：

<%% 输出为 <%
%%> 输出为 %>

文件包含

EJS提供两种包含其他文件的方式：

1. 预处理方式

<% include partials/header %>

特点：

• 被包含文件可以访问父模板的所有变量
• 在模板编译时处理，性能较高

2. include函数方式

<%- include('partials/header', {title: '首页'}) %>

特点：

• 需要显式传递变量
• 更符合JavaScript习惯
• 运行时处理，灵活性更高

安全提示：避免使用用户提供的路径作为包含文件路径，以防路径遍历问题。

最佳实践总结

1. 安全性：优先使用<%=进行输出，仅在必要时使用<%-并确保内容已净化
2. 代码组织：将复杂逻辑拆分为多个部分，使用文件包含提高可维护性
3. 性能：对于频繁使用的模板片段，考虑预处理方式包含
4. 可读性：适当添加注释，保持一致的缩进风格
5. 错误处理：为可能为空的变量提供默认值

结语

EJS以其简洁的语法和强大的功能，成为Node.js生态中广受欢迎的模板引擎。掌握其语法细节和最佳实践，能够帮助开发者构建更安全、高效的Web应用。通过本文的详细解析，希望读者能够全面理解EJS的核心功能，并在实际项目中灵活运用。

ejs Embedded JavaScript templates -- http://ejs.co 项目地址: https://gitcode.com/gh_mirrors/ej/ejs