EJS入门

2018-01-24 11:00:31
admin
951
最后编辑:admin 于 2018-01-29 09:20:11


EJS(Embedded JavaScript templates)是一个简单高效的模板语言,通过数据和模板,可以生成HTML标记文本。可以说EJS是一个JavaScript库,EJS可以同时运行在客户端和服务器端,客户端安装直接引入文件即可,服务器端用npm包安装。


一、下载和安装:


服务端源码下载地址:https://github.com/mde/ejs

服务端安装方法: npm install ejs



客户端需要使用EJS 运行时库:ejs.min.js

客户端源码下载地址:https://github.com/mde/ejs/releases/tag/v2.5.7


二、特点


1、快速编译和渲染

2、简单的模板标签

3、自定义标记分隔符

4、支持文本包含

5、支持浏览器端和服务器端

6、模板静态缓存

7、支持express视图系统



三、EJS成员函数



  • Render(str,data,[option]):直接渲染字符串并生成html str:需要解析的字符串模板 data:数据 option:配置选项
  • Compile(str,[option]):编译字符串得到模板函数 str:需要解析的字符串模板 option:配置选项

两个函数包括的配置选项如下:

cache:true,         //解析结果进行缓存 filename:"path",        //用于引入文件或指定cache的键名 scope:"this",           //指定函数执行的上下文对象 compileDebug:false, //当此项为false时,debug指令不会被编译 client:"",          //返回独立的编译后的函数 delimiter:"a tag",  //指定标签的开闭符号,默认为 % ,可以指定例如 ? 或$ open:"<%",          //指定开标签 close:"%>",         //指定闭标签 debug:true,         //输出生成的函数体 _with:false         //指定模板是否使用with(){}函数结构


四、EJS常用标签


<%  //所包含的内容是非输出的,用于控制流,如if、for等使用
<%= //输出对HTML转义后的字符串到模板中
<%- //输出原始的HTML串到模板中,不对HTML进行转义
<%# //注释标签,会被直接忽略
<%% //把 <%% 替换成 <% ,其他什么都不做
%>  //普通的结束标签
-%> //剪除模式,移除随后的换行符

说明:ejs中的逻辑代码全部用JavaScript



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<script src="/demo/ejs/ejs.min.js"></script>
<script>
    var html = ejs.render('<%=123 %>','');
	var template = ejs.compile('<%=456 %>');
    var result = template();
    //console.log(result);//123
    document.getElementById('div1').innerHTML = template;
	document.getElementById('div2').innerHTML = result;
	document.getElementById('div3').innerHTML = html;
</script>
</body>
</html>

尝试一下 »



  • 在线客服
  • 关注微信
  • 联系电话
    • 欢迎咨询
    • 欢迎加入QQ群 303257430
  • 公众号:源宝网络
    • 联系电话及微信号 18902328227