初窥nodejs（六） ——模板引擎(Ejs)

最新推荐文章于 2024-09-03 07:43:54 发布
最新推荐文章于 2024-09-03 07:43:54 发布
阅读量761 收藏 1
点赞数
分类专栏： Nodejs基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Nate__River/article/details/78052020
版权

写在前面

    目前nodejs的模板引擎有很多，各自有各自的优缺点。在本篇博客中，我会初步介绍其中的两个主流模板引擎之一：Ejs。
    EJS 和 Jade的争论一直存在，可以参考下面这篇知乎：

关于nodejs的模板引擎，如何选择 EJS 和 Jade？

ejs简介

ejs是基于原生js的，这使得它的语法近似js，易于上手。
ejs是非侵入式，非破坏的。

使用ejs

引入ejs

const ejs=require('ejs');

使用ejs

//对字符串进行渲染
var str=ejs.render('html'); 
//对文件进行渲染
var str=ejs.renderFile('./views/8.ejs');

ejs语法

<%= %>

后台js

const ejs=require('ejs');

ejs.renderFile('./views/1.ejs', {name: 'blue'},);

ejs代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div>
      <%=name%>
    </div>
  </body>
</html>

编译后

<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div>
      blue
    </div>
  </body>
</html>

for循环

后台js

const ejs=require('ejs');

ejs.renderFile('./views/3.ejs', {json: {arr: [
  {user: 'blue', pass: '123456'},
  {user: 'zhangsan', pass: '654321'},
  {user: 'xiaoming', pass: '999999'},
]}}, function (err, data){
  console.log(data);
});

ejs代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <% for(var i=0;i<json.arr.length;i++){ %>
    <div>用户名：<%=json.arr[i].user%> 密码：<%=json.arr[i].pass%></div>
    <% } %>
  </body>
</html>

编译后

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>

    <div>用户名：blue 密码：123456</div>

    <div>用户名：zhangsan 密码：654321</div>

    <div>用户名：xiaoming 密码：999999</div>

  </body>
</html>

<%- %>

<%=  %>表示转义输出 <h1> 输出 &lt;h1&gt; 防止注入攻击
<%-  %>表示不转义输出 <h1> 输出 <h1>

后台js

const ejs=require('ejs');

ejs.renderFile('./views/4.ejs', {}, function (err, data){
  console.log(data);
});

ejs代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <%
    var str="<div></div>";
    %>

    <%- str %>
  </body>
</html>

编译后

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div></div>
  </body>
</html>

include

后台js

const ejs=require('ejs');

ejs.renderFile('./views/5.ejs', {}, function (err, data){
  console.log(data);
});

ejs代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <% for(var i=0;i<3;i++){ %>
    <% include ../a.txt %>
    <% } %>
  </body>
</html>

编译后

<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
  我是a.txt
  我是a.txt
  我是a.txt
  </body>
</html>

总结

ejs并没有jade语法那么的繁杂，但是也没有jade那么的灵活。
它基于js，语法也近似于js。
帕尼尼0_0
关注
专栏目录
Node.js开发入门—使用jade模板引擎
安晓辉生涯——聚焦程序员的职业规划与成长
08-11 3万+
jade模板引擎的简介以及学习资源的链接……如何在express里使用jade模板引擎……
踏上nodejs的不归路——02express框架的引入与使用（1）
06-01
例如，我们可以集成ejs模板引擎： ```bash npm install ejs --save ``` 然后在配置文件中指定模板引擎： ```javascript app.set('view engine', 'ejs'); app.set('views', './views'); ``` 接着，我们可以在路由...
Node.js-一个简单快速类似ejs的node.js的模板引擎
08-10
一个简单、快速、类似ejs的node . js的模板引擎
nodejs模板引擎
欢迎关注微信公众号：DroidMind
12-21 626
１、ejs http://ejs.co/ http://www.embeddedjs.com/ https://www.npmjs.com/package/ejs ２、Jade http://jade-lang.com/ https://www.npmjs.com/package/jade http://expressjs.jser.us/jade.html ３、swig htt...
EJS 全面指南：从入门到实践
最新发布
gitblog_01064的博客
09-03 739
EJS 全面指南：从入门到实践 ejsEmbedded JavaScript templates -- http://ejs.co项目地址:https://gitcode.com/gh_mirrors/ej/ejs 项目介绍 EJS（Embedded JavaScript Templates） 是一个功能强大且广受欢迎的JavaScript模板引擎，用于将动态数据嵌入到HTML中。EJS设计简...
Node模版引擎(ejs, art-template)
MiMeng的博客
03-16 2224
模版引擎 1 ejs模版引擎 安装ejs模版引擎 $ npm i ejs -s 使用模版引擎 const express = require('express'); const app = express(); // 设置视图模版引擎 'ejs' app.set('view engine', 'ejs'); // 配置模版目录 让程序直到模版引擎的位置 app.set('view', './views'); app.get('/show', (request, response) =>
NodeJs之模板引擎及综合案例
十三阿哥的博客
06-01 1136
【代码】NodeJs之模板引擎及综合案例。
模板引擎ejs详解
12-19 178
singsingasong.js: const ejs=require('ejs'); ejs.renderFile('./views/singsingasong.ejs', {'name':'singsingasong',json: {arr: [ {user: 'blue', pass: '123456'}, {user: 'zhangsan', pass: '654321...
详解nodejs微信公众号开发——3.封装消息响应模块
12-23
1. ejs模板引擎 不使用拼接字符串的方式，那么模板引擎就是较好的选择。Nodejs开源模板的选择很多，程序中使用 EJS，有Classic ASP/PHP/JSP的经验用起EJS来的确可以很自然，也就是说，你能够在 <%...%> 块中...
perfect-palate:这是一个使用NodeJS，ExpressJS，EJS，Multer，GridFS和MongoDB开发的协作简单食谱书Web应用程序。 即将部署
04-11
总的来说，"perfect-palate"项目充分利用了Node.js的非阻塞I/O特性，结合Express.js的强大路由和中间件功能，EJS的模板引擎让界面更加动态，Multer处理文件上传，MongoDB与GridFS则提供了灵活的数据存储和大文件管理...
踏上nodejs的不归路——03阶段性胜利
06-01
6. **模板引擎**：对于动态网页，可能已经集成并使用了EJS、Pug等模板引擎来渲染HTML。 7. **数据库操作**：可能通过Mongoose或其他库与MongoDB进行了交互，实现了数据的增删改查。 8. **命令行工具**：可能创建了...
Nodejs 模板引擎ejs
weixin_41040445的博客
04-23 256
安装ejscnpm install –-save ejs 基本使用 ┣ views │┣ index.ejs ┣ app.js index.ejs <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name=..
#NodeJS 服务器基本模板
aoyou4854的博客
07-22 173
基本server配置 cookie /session/ get数据 /post数据 / 请求方法 const express=require('express'); const static=require('express-static'); const cookieParser=require('cookie-parser'); const cookieSessi...
NodeJs EJS 模板引擎
weixin_44714325的博客
02-21 134
EJS 常用标签 <% %>流程控制标签 <%= %>输出标签（原文输出 HTML 标签） <%- %>输出标签（HTML 会被浏览器解析） 安装： npm install ejs –save / cnpm install ejs --save Nodejs 中使用： var http = require("ejs"); ... ejs.renderFile(filename, data, options, function(err, str){ res.wri.
基于Node.js的模板引擎大比拼
热门推荐
chszs的专栏
02-28 1万+
基于Node.js的模板引擎大比拼作者：chszs，未经博主允许不得转载。经许可的转载需注明作者和博客主页：http://blog.csdn.net/chszs本文对基于Node.js的模板引擎做了一个汇总和对比，具体如下。Mustache官网见：http://mustache.github.io/ Mustache是一个非常简单易用的模板引擎，号称无逻辑的模板引擎，可以用于HTML、配置文件、源
模板引擎ejs
starcraft501的专栏
09-16 256
  模板引擎（Template Engine）是一个将页面模板和要显示的数据结合起来生成 HTML 页面的工具。如果说上面讲到的 express 中的路由控制方法相当于 MVC 中的控制器的话，那模板引擎就相当于 MVC 中的视图。 模板引擎的功能是将页面模板和要显示的数据结合起来生成 HTML 页面。它既可以运 行在服务器端又可以运行在客户端，大多数时候它都在服务器端直接被解析为 HTML，解...
模板引擎EJS
万里归来少年心
02-23 444
1.安装 npm install ejs 2.使用 var ejs = require("ejs"); var str = "Iphone&lt;%= n %&gt; is my love!"; var num = { n : 6}; var result = ejs.render(str, num); console.log(result);    执行结果 Iphone6 i...
EJS模板引擎
wandongle的博客
06-09 222
可以看到在EJS中使用JS的代码是非常方便的，基本只需要将其加在<% %>中，就可以对JS进行解析。变量的输出则是依靠<%= %>。此外，我们也可以通过include引入其他的模板文件，能极大的增强代码的复用性。
nodejs 最好使用哪个模板引擎
06-07
在 Node.js 中使用哪个模板引擎，主要取决于个人喜好和项目需求。以下是几个比较流行的 Node.js 模板引擎，可以根据自己的需求进行选择： 1. **EJS（Embedded JavaScript）**：EJS 是一款简单、高效、易学易用的模板引擎，它的语法类似于普通的 HTML，支持 JavaScript 语法，也可以使用自定义分隔符。EJS 可以直接在 Node.js 中使用，也可以在浏览器端使用。 2. **Pug（原名 Jade）**：Pug 是一款高性能、简洁优雅、易于理解的模板引擎，它的语法比较简单，使用缩进代替标签，支持嵌套标签、变量、表达式和控制结构。Pug 可以在 Node.js 和浏览器端使用。 3. **Handlebars**：Handlebars 是一款灵活、强大且易于使用的模板引擎，它的语法类似于 Mustache，支持变量、表达式、控制结构、自定义帮助函数等。Handlebars 可以在 Node.js 和浏览器端使用。 4. **Mustache**：Mustache 是一款简单、易于理解的模板引擎，它的语法比较简单，只支持变量和控制结构，但是可以使用自定义标签和自定义帮助函数。Mustache 可以在 Node.js 和浏览器端使用。 总之，选择哪个模板引擎主要取决于个人喜好和项目需求，需要根据具体情况来选择。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值