02.简单了解ejs模板

最新推荐文章于 2023-10-14 01:54:25 发布

962464i

最新推荐文章于 2023-10-14 01:54:25 发布

阅读量286

点赞数

分类专栏： nodejs

本文链接：https://blog.csdn.net/waei08/article/details/77743684

版权

nodejs 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

1.创建ejs文件夹，shift+右键打开cmd命令窗口

npm init -y

cnpm install ejs --save-dev
简写：cmp i ejs --save-dev

2.ejs文件夹下创建index.js

var http = require("http");
var ejs = require("ejs");
var server  = http.createServer(function(req,res){
    if (req.url=="/favicon.ico") return;
    res.writeHead(200,{"Content-Type":"text/html;charset=UTF-8"});
    var str = "第一次使用ejs模板<%=a%>";
    var strRender = ejs.render(str,{a:",我是拼接上的字符串"});
    res.write(strRender);
    res.end();
});
server.listen(80);

例2

1.ejs文件夹下创建tp.js
2.使用ejs模板，把index.html模板信息、tp.js中的对象数据拼接

tp.js

var http = require("http");
var ejs = require("ejs");
var fs = require("fs");
var server  = http.createServer(function(req,res){
    if(req.url == "/favicon.ico") return ;
    res.writeHead(200,{"Content-type":"text/html;charset=UTF-8"});
    fs.readFile("./01view/index.html",function(err,data){
        var obj = {
            name:"马克思",
            list:["中国","美国","加拿大","日本"],
            list1:[
                {
                    href:"http://www.baidu.com",
                    name:"百度"
                },{
                    href:"http://www.zzg.com",
                    name:"zzg的个人空间"
                },{
                    href:"http://99.com",
                    name:"九块九包邮"
                }
            ]
        }
        res.write(ejs.render(data.toString(),obj));
        res.end("bbbbb");
    });
});
server.listen(80);

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    我叫<%=name%>,我去过
    <%for(var i=0;i<list.length;i++){%>
         <%=list[i]%>
    <%}%>
    <%for(var j=0;j<list1.length;j++){%>
        <p><a href="<%=list1[j].href%>" target="_blank"><%=list1[j].name%></a></p>
    <%}%>
</body>
</html>