一、简介

相比于jade模板引擎,ejs对原HTML语言就未作出结构上的改变,只不过在其交互数据方面做出了些许修改,相比于jade更加简单易用。因此其学习成本是很低的。您也可参考ejs官网:https://ejs.bootcss.com/

二、ejs基本使用

这里我们使用如下配置文件:

我们啊可以通过下面的方式实现基本的ejs操作:

app.js文件:

const express=require("express");
const ejs=require("ejs");
const fs=require("fs"); var app=express(); //引用ejs
app.set('views',"public"); //设置视图的对应目录
app.set("view engine","ejs"); //设置默认的模板引擎
app.engine('ejs', ejs.__express); //定义模板引擎 app.get("/",function(req,res){
res.render("index.ejs",{title: "<h4>express</h4>"});
}); app.listen(8080);

  ejs文件:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<% for(var i=0;i<10;i++){ %>
<%= i %>
<% } %>
<!-- 获取变量 -->
<div class="datas">
<p>获取变量:</p>
<%- title %>
<%= title %>
</div>
</body>
</html>

  这时我们会得到如下图的结果:

由此可以知道:
<% xxx %>:里面写入的是js语法,
<%= xxx %>:里面是服务端发送给ejs模板转义后的变量,输出为原html
<%- xxx %>:里面也是服务端发送给ejs模板后的变量,不过他会把html输出来

同理res.render()函数也是支持回调的:

res.render('user', { name: 'Tobi' }, function(err, html) {
console.log(html);
});

  这样我们即可将看到heml的内容。另外值得说明的是ejs模块也有ejs.render()和ejs.renderFile()方法,他在这里与res.render()作用类似,如下:

ejs.render(str, data, options);

ejs.renderFile(filename, data, options, function(err, str){
// str => 输出绘制后的 HTML
});

  三、ejs标签各种含义

<% '脚本' 标签,用于流程控制,无输出。
<%_ 删除其前面的空格符
<%= 输出数据到模板(输出是转义 HTML 标签)
<%- 输出非转义的数据到模板
<%# 注释标签,不执行、不输出内容
<%% 输出字符串 '<%'
%> 一般结束标签
-%> 删除紧随其后的换行符
_%> 将结束标签后面的空格符删除

四、option的配置:

cache 		缓存编译后的函数,需要提供 filename
filename 被 cache 参数用做键值,同时也用于 include 语句
context 函数执行时的上下文环境
compileDebug 当为 false 时不编译调试语句
client 返回独立的编译后的函数
delimiter 放在角括号中的字符,用于标记标签的开与闭
debug 将生成的函数体输出
_with 是否使用 with() {} 结构。如果为 false,所有局部数据将存储在 locals 对象上。
localsName 如果不使用 with ,localsName 将作为存储局部变量的对象的名称。默认名称是 locals
rmWhitespace 删除所有可安全删除的空白字符,包括开始与结尾处的空格。对于所有标签来说,它提供了一个更安全版本的 -%> (在一行的中间并不会剔除标签后面的换行符)。
escape 为 <%= 结构设置对应的转义(escape)函数。它被用于输出结果以及在生成的客户端函数中通过 .toString() 输出。(默认转义 XML)。

  以上就为ejs基本用法,往后对数据库操作就直接把json数据从服务器返送给模板引擎就行;

Express全系列教程之(十一):渲染ejs模板引擎的更多相关文章

  1. Express全系列教程之(十):jade模板引擎

    一.前言 随着前端业务的不断发展,页面交互逻辑的不断提高,让数据和界面实现分离渐渐被提了出来.JavaScript的MVC思想也流行了起来,在这种背景下,基于node.js的模板引擎也随之出现. 什么 ...

  2. Express全系列教程之(一):Express的安装 和第一个程序

    前言 ndoe.js,一个基于javsscript运行环境的服务器语言,它的出现使得javascript有能力去实现服务器操作.在gitHub上ndoe.js的star数已接近6万,可见其受欢迎程度: ...

  3. Express全系列教程之(九):将session上传至mysql数据库

    一.简介 实际引用中,有些公司在不同地区会设置不同服务器,因此就需要用到nginx以实现负载均衡,这时,将session数据保存至数据库就成为了需要面对的问题,我们以MySQL数据库为例,看看他是如何 ...

  4. Express全系列教程之(八):session的基本使用

    一.关于session session是另一种记录客户状态的机制,与cookie保存在客户端浏览器不同,session保存在服务器当中:当客户端访问服务器时,服务器会生成一个session对象,对象中 ...

  5. Express全系列教程之(七):cookie的加密

    一.关于cookie加密 cookie加密是让客户端用户无法的值cookie明文信息,是数据安全的重要部分:一般的我们可以在保存cookie时对cookie信息进行加密,或者在res.cookie中对 ...

  6. Express全系列教程之(六):cookie的使用

    一.关于Cookie 在我们关闭一个登录过的网址并重新打开它后,我们的登录信息依然没有丢失:当我们浏览了商品后历史记录里出现了我们点击过的商品:当我们推回到首页后,推荐商品也为我们选出了相似物品:事实 ...

  7. Express全系列教程之(五):Express的中间件

    一.中间件 从字面意思,我们可以了解到它大概就是做中间代理操作,事实也是如此:大多数情况下,中间件就是在做接收到请求和发送响应中间的一系列操作.事实上,express是一个路由和中间件的web框架,E ...

  8. Express全系列教程之(四):获取Post参数的两种方式

    一.关于POST请求 post方法作为http请求很重要的一部分,几乎所有的网站都有用到它,与get不同,post请求更像是在服务器上做修改操作,它一般用于数据资源的更新.相比于get请求,post所 ...

  9. Express全系列教程之(三):get传参

    一.关于get请求 一般在网站开发中,get都用作数据获取和查询,类似于数据库中的查询操作,当服务器解析前台资源后即传输相应内容:而查询字符串是在URL上进行的,形如: http://localhos ...

随机推荐

  1. centos swap分区

    swap分区         通常memory是机器的物理内存,读写速度低于cpu一个量级,但是高于磁盘不止一个量级.所以,程序和数据如果在内存的话,会有非常快的读写速度.但是,内存的造价是要高于磁盘 ...

  2. 我说CMMI之五:CMMI 4个等级的区别--转载

    我说CMMI之五:CMMI 4个等级的区别 了解CMMI的人都知道CMMI有5个等级,但是要将5个等级的区别真正说明白,说透彻不太容易.下面我们用一个表格概括之.表格中并没有1级,1级在CMMI中没有 ...

  3. python进阶ing——创建第一个Tornado应用

    python进阶ing——创建第一个Tornado应用 分类: Python2013-06-02 23:02 1725人阅读 评论(2) 收藏 举报 pythonTornado 每天在群里跟很多群友讨 ...

  4. cookie和session django中间件

    目录 一.cookie和session 1. 为什么要有cookie和session 二.cookie 1. 什么是cookie 2. django中关于cookie的使用 (1)后端设置cookie ...

  5. github上创建项目

    1.github登陆之后,创建仓库 2.填写项目基本信息 3.就这么简单创建好啦 4.此时点击这里就可以克隆地址了

  6. 如何开始使用 Akka

    如果你是第一次开始使用 Akka,我们推荐你先运行简单的 Hello World 项目.情况参考  Quickstart Guide 页面中的内容来下载和运行 Hello World 示例程序.上面链 ...

  7. linux下nohup日志切割方案

    1.nohup命令解释: a.语法:nohup [command] [args] [&] b.说明:nohup 命令运行由 Command 参数和任何相关的 Arg 参数指定的命令,忽略所有挂 ...

  8. [CSP-S模拟测试]:开心的金明(贪心+模拟)

    题目传送门(内部题117) 输入格式 第一行一个整数$k$,表示需要处理的月份数. 接下来的$k$行,每行$4$个整数,第$1+i$行分别为:$c_i,d_i,m_i,p_i$ 接下来的$k-1$行, ...

  9. HashMap、Hashtable、HashSet三种hash集合的区别

    转载:http://www.cnblogs.com/lzrabbit/p/3721067.html#h1 HashMap和Hashtable的区别 两者最主要的区别在于Hashtable是线程安全,而 ...

  10. vue计算属性详解

    一.什么是计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> ...