1:利用 NPM 安装 EJS 很简单

npm install ejs

2:安装完成肯定就是使用了

var template = ejs.compile(str, options);
template(data);
// => 输出绘制后的 HTML 字符串 ejs.render(str, data, options);
// => 输出绘制后的 HTML 字符串 ejs.renderFile(filename, data, options, function(err, str){
// str => 输出绘制后的 HTML 字符串
});

3:当然如何引用参数进行数据绑定呢?

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

4:循环

//模板定义.ejs
<ul>
<% for(var i in users){ %>
<li><%= users[i].username %>--<%= users[i].age %></li>
<% } %>
</ul> //运行后生产html代码.html
<ul> <li> Jack </li> <li> Rose </li> <li> Alice </li> <li> Ave </li> </ul>

5:变量定义标签的样式属性

<h1 style="<%= style %>"></h1>

  

6:if判断语句

//模板定义将所有条件判断代码放<% %>里面即可
<% if(isLogin){ %>
<p><a href="#">Jerry</a> | <a href="#">退出</a></p>
<% }else{ %>
<p><a href="#">登录</a> | <a href="#">注册</a></p>
<% } %>

7:利用<%- include filename %>加载其他页面模版;

学习ejs的入门基础就到这里,后面我们还会有使用ejs+nodejs进行代码模板生成,谢谢大家阅读,希望能够帮助到大家。

模板引擎ejs入门学习的更多相关文章

  1. 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍

    动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...

  2. 模板引擎之jade 学习

    jade 模板引擎在node express 开发中有较多的使用,首先我们看一个简单的使用jade 生成的html 页面的标签代码: doctype html html(lang="en&q ...

  3. Java模板引擎之Freemarker 学习笔记 一

    什么是Freemarker Freemarker是模板引擎,不是Web框架,只是视图层的组件,官网是 https://freemarker.apache.org/ Freemarker原理 数据模型+ ...

  4. nodeJs学习-10 模板引擎 ejs语法案例

    ejs语法案例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...

  5. EJS 入门学习

    EJS(Embedded JavaScript templates)是一个简单高效的模板语言,通过数据和模板,可以生成HTML标记文本.可以说EJS是一个JavaScript库,EJS可以同时运行在客 ...

  6. javascript模板引擎之artTemplate 学习笔记

    <div id="content"></div><div id="content1"></div><h1& ...

  7. 模板引擎ejs详解

    singsingasong.js: const ejs=require('ejs'); ejs.renderFile('./views/singsingasong.ejs', {'name':'sin ...

  8. nodejs 模板引擎ejs的使用

    1.test.ejs文件 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  9. 模板引擎ejs

    1.网站 https://ejs.co/ https://ejs.bootcss.com/ 2.app.js var http=require("http"); var ejs = ...

随机推荐

  1. GAITC 2019全球人工智能技术大会(南京)

    2019年5月25日至26日,由中国人工智能学会主办,以“交叉.融合.相生.共赢”为主题的2019GAITC将在南京全新亮相. 2019 全球人工智能技术大会(2019 GAITC)以“前端引领.深度 ...

  2. VS 2017 激活码

    最近逐渐抛弃了 VS2015  更新迭代到2017版本安装流程不必说激活码双手奉上 Enterprise: NJVYC-BMHX2-G77MM-4XJMR-6Q8QF Professional: KB ...

  3. phpstorm----------phpstorm设置自动更新的ssh信息如何修改--后续增加如何设置自动更新

    1.如何设置phpstorm将本地代码时时同步到远程服务器 注意下面一定要打勾 点击下一步,然后还有一个页面,然后不用做任何操作,直接点击完成.中途有个页面是输入远程服务器ip账号密码链接方式的,那个 ...

  4. Maven 学习笔记-maven属性

    Maven有六类属性: 1)内置属性 主要有两个常用内置属性 ${basedir}:表示项目根目录,即包含pom.xml文件的目录: ${version}:表示项目版本: 2)POM属性 ${M2_H ...

  5. (.NET高级课程笔记)泛型总结

    泛型总结 1.引入泛型:延迟声明,即在声明的时候没有指定参数类型,只有当调用的时候才会确定 其参数类型(架构师的理念:推迟一切可以推迟的) 2.如何声明和使用泛型 3.泛型的好处和原理 4.泛型类.泛 ...

  6. PAT (Basic Level) Practice (中文)1001 害死人不偿命的(3n+1)猜想

    1001 害死人不偿命的(3n+1)猜想 卡拉兹(Callatz)猜想: 对任何一个正整数 n,如果它是偶数,那么把它砍掉一半:如果它是奇数,那么把 (3n+1) 砍掉一半.这样一直反复砍下去,最后一 ...

  7. Git 命令及git服务器

    Linux 服务器上安装git yum -y install git git config  --global user.name "name" git config  --glo ...

  8. delphi 的一些注意点和知识点

    关于Delphi中产生的文件    编辑阶段: pas/单元文件,dpk/组件包文件,dpr/工程文件,dfm/窗体文件    编译阶段: dcu/单元编译文件,dcp/Delphi Compile ...

  9. python3 短网址和数字的相互转换的代码

    下面内容是关于python3 短网址和数字的相互转换的内容. import mathimport decimal def convert_to_code(num): """ ...

  10. qemu到kvm的处理,再到vm的运行

    1.QEMU创建虚拟机发起:kvm_ioctl(s, KVM_CREATE_VM, type); KVM中kvm_dev_ioctl判断参数->kvm_dev_ioctl_create_vm-& ...