node.js中EJS 模板快速入门教程

EJS是一种在Node.js环境中广泛使用的模板引擎，其语法简单直观，允许开发者在HTML标签中嵌入JavaScript代码。EJS模板引擎是构建动态网页的理想选择，尤其是在使用Express框架时。通过EJS可以轻松地将数据与HTML模板结合，从而生成动态的Web页面。 要开始使用EJS，需要先通过npm安装EJS。安装命令如下： ``` npm install ejs ``` EJS的主要工作方式是通过两个主要方法：`***pile(str, options)` 和 `ejs.render(str, options)`。其中，`compile` 方法用于编译模板并返回一个函数，该函数可以被多次调用用于渲染模板。而 `render` 方法直接返回渲染后的字符串。 模板中，可以通过 `<%%>` 与 `<% %>` 来执行JavaScript代码。在 `<% %>` 中的JavaScript代码会被执行但不会输出到最终的HTML页面，而 `<%= %>` 会被执行并输出到HTML页面中。 例如，以下是一段EJS模板代码： ```ejs <% if(names.length) { %> <ul> <% names.forEach(function(name) { %> <li><%= name %></li> <% }) %> </ul> <% } %> ``` 在这里，`<% if(names.length) { %>` 是一个JavaScript条件判断语句，用来检查变量 `names` 是否包含至少一个元素。如果条件满足，则执行下面的代码块。 EJS模板可以通过读取文件的方式来使用，如下例： ```javascript var ejs = require('ejs'); var str = fs.readFileSync(__dirname + '/list.ejs', 'utf8'); var ret = ejs.render(str, { names: ['foo', 'bar', 'baz'] }); console.log(ret); ``` 这里首先引入了EJS模块和文件系统模块（fs），然后读取了`list.ejs`文件的内容，最后调用`ejs.render`方法来渲染模板，并输出结果。 EJS还允许模板的缓存，通过设置 `cache` 选项为 `true` 可以缓存编译后的模板，从而提高性能。同时，`filename` 选项是缓存的键名称，它用于缓存模板对象，以便之后可以重复使用。 在模板中定义局部变量也是可能的，例如： ```ejs <h1>Users</h1> <% function user(user) { %> <li><strong><%= user.name %></strong> is a <%= user.age %> year old <%= user.species %>.</li> <% } %> <ul> <% users.map(user) %> </ul> ``` 这里通过 `<% function user(user) { %>` 定义了一个局部函数，并在随后的代码块中调用该函数。 EJS模板支持编译，即`ejs.render(str, options)`方法在执行时会先编译模板字符串，随后执行编译后的函数。这避免了IO操作，提高了性能。使用模板时还可以传递数据对象，比如： ```javascript var ret = ejs.render(str, { users: users, filename: path }); ``` 数据和选项可以放在同一个对象中。 EJS模板还支持自定义标签和自定义分隔符，例如： ```javascript var ejs = require('ejs'); ejs.open = '{{'; ejs.close = '}}'; ``` 这样，EJS模板就可以使用自定义的 `{{ }}` 标签来代替默认的 `<% %>` 标签。 EJS还允许使用过滤器来格式化输出，例如： ```javascript ejs.filters.last = function(obj) { return obj[obj.length - 1]; }; ``` 这样就可以在模板中使用过滤器来获取对象中的最后一个元素，如： ``` <p><%= users | last %></p> ``` 此外，EJS也支持在客户端使用编译后的模板，但是默认情况下，EJS不会被自动引入客户端。如果需要在浏览器中使用EJS，必须手动引入EJS库文件。 通过以上内容，我们可以了解到EJS模板的基本概念、安装方法、基础语法、渲染方式、模板的编译和缓存机制、自定义标签和分隔符、过滤器的使用以及在客户端的使用方法。掌握这些知识点，就能在Node.js项目中有效地利用EJS模板引擎来处理Web页面的生成。