首页 > 代码库 > node08---EJS模版

node08---EJS模版

2024-10-07 10:23:38   216人阅读

四、模板引擎
<a href="http://www.mamicode.com/"><img src="http://www.mamicode.com/" ></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 =http://www.mamicode.com/ {
    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模版


联系
我们