Node.js EJS模板引擎
程序员文章站
2022-03-16 16:30:27
...
初识 EJS 模块引擎
我们学的 EJS 是后台模板,可以把我们数据库和文件读取的数据显示到 Html 页面上面。它 是一个第三方模块,需要通过 npm 安装 https://www.npmjs.com/package/ejs
安装:
npm install ejs –save / cnpm install ejs --save
Nodejs 中使用:
ejs.renderFile(filename, data, options, function(err, str){
// str => Rendered HTML string
});
EJS 常用标签
<% %>
流程控制标签<%= %>
输出标签(原文输出 HTML 标签)<%- %>
输出标签(HTML 会被浏览器解析)
//引入http模块
var http=require('http');
var url=require('url');
var ejs=require('ejs');
//路由:指的就是针对不同请求的 URL,处理不同的业务逻辑。
http.createServer(function(req,res){
res.writeHead(200,{"Content-Type":"text/html;charset='utf-8'"});
var pathname=url.parse(req.url).pathname;
if(pathname=='/login'){
var data='你好我是后台数据';
var list=[
'1111',
'2222',
'3333',
];
//把数据库的数据渲染到模板上面
ejs.renderFile('views/login.ejs',{
msg:data,
list:list
},function(err,data){
res.end(data);
})
}else{
var msg='这是注册页面,也是注册的路由';
var h="<h2>这是一个h2</h2>"
ejs.renderFile('views/register.ejs',{
msg:msg,
h:h
},function(err,data){
res.end(data);
})
}
}).listen(8001);
login.ejs
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
</head>
<body>
<h2>这是一个ejs的后台模板引擎-登录</h2>
<h2><%=msg%></h2>
<br/>
<hr/>
<ul>
<% for(var i=0;i<list.length;i++){%>
<li><%=list[i]%></li>
<% } %>
</ul>
</body>
</html>
register.ejs
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
</head>
<body>
<h2>注册</h2>
<%=msg%>
<br/>
<%-h%>
</body>
</html>