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. python-爬虫(3)---lxml匹配css

    百度首页  部分代码 <div class="s_tab_inner"> <b>网页</b> <a href="//www.ba ...

  2. cdh安装spark遇到的几个BUG

    spark安装后启动: [zdwy@master spark]$ sbin/start-all.sh starting org.apache.spark.deploy.master.Master, l ...

  3. PHP yii框架FormWidget组件

    本篇文章介绍的是PHP yii框架Form组件,方便在view层更好调用此功能,话不多说上代码:1.先继承yii本身Widget类 <?php/** * User: lsh */ namespa ...

  4. 字节转化为结构体BytesToStruct

    //结构体转字节数组 public byte[] StructToBytes (object structObj) { int size = Marshal.SizeOf (structObj);// ...

  5. 《ASP.NET Core In Action》读书笔记系列,这是一个手把手的从零开始的教学系列目录

    最近打算系统学习一下asp.net  core ,苦于没有好的中文书藉,只好找来一本英文的 <ASP.NET Core In Action>学习.我和多数人一样,学习英文会明显慢于中文.希 ...

  6. SQL count(1)

    If you are ever unsure what to put inside a COUNT() aggregation, you can do COUNT(1) to count the ro ...

  7. 关于JDBC学习过程中的注意事项(分享自己犯过的错误,写给初学JDBC的小伙伴的八条建议)

    关于JDBC学习过程中的注意事项(分享自己犯过的错误,写给初学JDBC的小伙伴的八条建议) 前言:最近在学习JDBC,总结了几个小问题,特地分享给大家,让大家不要犯这样的错误,也希望大家养成学会总结的 ...

  8. Angular4 表单处理

  9. spring boot+spring data jpa+gradle+mysql配置问题

    1.gradle/wrapper/gradle-wrapper里要设置正确本地的gradle目录(我用的是4) 2.在src目录里的application.properties文件里,可以这样设置 # ...

  10. win7有多条隧道适配器(isatap、teredo、6to4)的原因及关闭方法

    问题:sdp协商时,带有IPV6的信息,需要将IPV6相关信息去掉 原因:网卡启用了ipv6通道 解决:关闭IPv6数据接口 netsh interface isatap set state disa ...