標籤:server read text 字元 ade script html console char
四、模板引擎<a href="<%= url %>"><img src="<%= imageURL %>" ></a>資料繫結,就成為一個完整的html字串了。前台的模板,我們現在要學習的是背景模板。後台模板,著名的有兩個,第一個叫做ejs; 第二個叫做jade。是npm第三方包。先說EJSEmbedded 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引擎效率高,難度大
node08---EJS模版