四、模板引擎
<a href="<%= url %>"><img src="<%= imageURL %>" ></a>
数据绑定，就成为一个完整的html字符串了。
前台的模板，我们现在要学习的是后台的模板。
后台模板，著名的有两个，第一个叫做ejs； 第二个叫做jade。
是npm第三方包。
先说EJS
Embedded JavaScript templates
后台模板引擎
<ul>
<% for(var i = 0 ; i < news.length ; i++){ %>
<li><%= news[i] %></li>
<% } %>
</ul>
var dictionary = {
a:6,
news : ["1期班太牛逼了","高薪就业","哈哈哈哈哈"]
};
14.js
/**
* Created by Danny on 2015/9/20 16:59.
*/
var ejs = require("ejs");
//模板
var string = "好高兴啊，今天我买了iphone<%= a %>s";
//数据
var data = {
a : 6
};
//数据绑定
var html = ejs.render(string, data);
//输出
console.log(html);
15.js
/**
* Created by Danny on 2015/9/20 16:59.
*/
var ejs = require("ejs");
var fs = require("fs");
var http = require("http");
var server = http.createServer(function(req,res){
fs.readFile("./views/index.ejs",function(err,data){
//绑定模板
var template = data.toString();
var dictionary = {
a:6,
news : [
{"title":"陈伟我爱你","count":10},
{"title":"哈哈哈哈","count":20},
{"title":"逗你玩儿的","count":30}
]
};
var html = ejs.render(template,dictionary);
//显示
res.writeHead(200,{"Content-Type":"text/html;charset=UTF8"});
res.end(html);
});
});
server.listen(3000);
index.ejs
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>好高兴啊，今天我买了一个iphone<%= a %>s</h1>
<ul>
<%
for(var i = 0 ; i < news.length ; i++){
if(news[i].count > 15){
%>
<li><%= news[i].title %></li>
<%
}
}
%>
</ul>
</body>
</html>
EJS模版效率不高，JADE引擎效率高，难度大
时间： 2024-10-12 20:45:23