ejs模板的书写

友情链接：ejs.co、embeddedjs

---

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

2、EJS的特点：

• 快速编译和渲染

• 简单的模板标签

• 自定义标记分隔符

• 支持文本包含

• 支持浏览器端和服务器端

• 模板静态缓存

• 支持express视图系统

3、EJS成员函数：

• Render(str,data,[option]):直接渲染字符串并生成html

str：需要解析的字符串模板

data：数据

option：配置选项

• Compile(str,[option]):编译字符串得到模板函数

str：需要解析的字符串模板

option：配置选项

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

4、EJS常用标签

• <% %>流程控制标签

• <%= %>输出标签（原文输出HTML标签）

• <%- %>输出标签（HTML会被浏览器解析）

• <%# %>注释标签

• % 对标记进行转义

• -%>去掉没用的空格

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

5、接下来看一个例子就可以明白EJS的简单语法了

运行后结果如下：

4、过滤器（把结果进一步加工的函数）：

语法如下：

<%=: data.age | plus:5%>

注意:和|两个符号:

此外，还有文件包含的语法：

<%- include(path) %>

接下来用这个写一个服务器端的，文件目录如下：

app.js文件内容如下：

var http=require("http");
var express=require("express");
var app=express();

var tem={
    message:"我是中间部分"
}
//创建服务器
http.createServer(app).listen(3000,function(){
    console.log("Server is listening port 3000");
});
//挂载静态资源处理中间件
app.use(express.static(__dirname+"/public"));
//设置模板视图的目录
app.set("views","./public/views");
//设置是否启用视图编译缓存，启用将加快服务器执行效率
app.set("view cache",true);
//设置模板引擎的格式即运用何种模板引擎
app.set("view engine","ejs");
//设置路由
app.get("/ejs",function(req,res){
    res.render("ejs1",{title:tem.message});
});

ejs1.ejs文件内容如下这里引用了头部和尾部：

<%- include("./header.ejs") %>
    
<%=title%>
    <%- include("./footer.ejs") %>

头部和尾部都是一行代码如下：

我是头部
我是尾部

启动服务器后，我们输入http://localhost:3000/ejs，显示内容如下：

这说明我们利用ejs模板做到了正确输出，这既可以大大增加代码的复用性，而且当data为数据库中的数据时，我们就可以做到实时更新网站数据了，这样一个简单动态网站就完成了，听起来是不是很简单，不过还有很长一段路要走滴，先睡了，下次再更。

最后是一个广告贴，最近新开了一个分享技术的公众号，欢迎大家关注