Node.js EJS 模板

0x01 什么是 ejs 模板

使用过 react.js 的朋友应该知道 JSX 语法，其实 ejs 模板与其类似，它是 javascript 和 html 的结合，通过特定的 ejs 语法把 javascript 代码嵌入到 html 标签，该模板文件以 .ejs 作为文件的后缀名，通过 ejs 引擎渲染后，生成我们需要的 html 代码进行展示，在 node.js web 开发中经常会用到该技术，本篇文章主要介绍 ejs 模板的实用标签语法。

ejs 模板

0x02 ejs 标签语法

• <% %> 在标签里可以写任意的 javascript 代码，可以把 javascript 代码拆开或者合在一起写，也可以与 html 标签一起写：

<% var a = 1
   var b = 2 
   var c = a+b %>

// var user = [1,2,3]
<% for(let i=0; i<user.length; i++) { %>
<p> html </p>
<% } %>

• <%= %> 输出转义后的内容

// ejs
<p><%= '<lol>' %></p>

// 转义后
<p>&lt;lol&gt;</p>

• <%- %> 输出未转义的内容

// ejs
<p><%- '<a href="http://www.baidu.com>baidu</a>' %></p>

// 不转义的输出
<p><a href="http://www.baidu.com>baidu</a></p> 

• <%# %> 注释
• include 引入其他 ejs 文件，比如引用当前 ejs 文件同级目录下有一个名为 test.ejs 的文件，代码如下：

// exp1
<% var data = 1 %>
<% include ./test %>

// exp2
<%- include('test', {data:1}) %>

注意，exp1 可以把当前的变量 data 传入到 test.ejs ；而 exp2 不能，需要在 include() 函数中指明要传的变量，且 exp2 一定要用 <%- %> 标签

• <%% 输出 <%
• %%> 输出 %，官网文档里面说输出 %>，但是作者亲测是 %
• <%_ 和 _%>， ejs模板会生成一些无用的空白，这两个标签去掉这些空白，每个标签可以分开使用
• -%> ejs模板会生成一些无用的换行，这个标签可以去掉这些换行

0x03 实战

作者写了一个相关的 node.js web 项目(GitHub 地址)，里面含有相关的代码，感兴趣的朋友可以下载学习。

简书作者 小菜荔枝 转载请联系作者获得授权