8.ejs模板语言

最新推荐文章于 2024-05-11 21:19:51 发布

FatPuffer

最新推荐文章于 2024-05-11 21:19:51 发布

阅读量104

点赞数

分类专栏： nodejs 文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/qq_42517220/article/details/126699946

版权

nodejs 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

1.下载安装

cnpm install ejs --save

2.模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>EJS 模板引擎</title>
</head>
<body>
    <h3><%= msg %></h3>
    <br>
    <ul>
    	<!--for循环-->
        <% news.forEach(function(data){ %>
            <li><%=data.title%></li>
        <% }); %>
    </ul>
</body>
</html>

3.渲染

const http = require("http");
const url = require("url");
const ejs = require('ejs');  // cnpm install egs --save

http.createServer(function(request, response){
    let pathName = url.parse(request.url).pathname;
    let list = [
            {
                title: 'news1'
            },
            {
                title: 'news2'
            },
            {
                title: 'news3'
            },
            {
                title: 'news4'
            },
            {
                title: 'news5'
            },
            {
                title: 'news6'
            }
        ]
    let text = '';
    if (pathName == '/login'){
        let text = "欢迎登录！"  // 模拟数据库数据
        // 渲染模板
        ejs.renderFile('./views/login.ejs', {
            'msg': text, 
            'news': list
        }, {}, function(err, content){
        response.writeHead(200, {"Content-Type": "text/html;charset=utf-8"});
            response.end(content);
        })
    } else {
		response.writeHead(404, {"Content-Type": "text/plain;charset=utf-8"});
		response.end("页面不存在");
	}
}).listen(8081);
console.log('Server runnng at http://127.0.0.1:8081/');

4.Get、Post

1.获取GET传值

var urlinfo = urlparse(req, true);
var body = urlinfo.query;
// body.page
// body.offset
// ...

2.获取POST传值

<!--form.ejs-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
</head>
<body>
    <form action="/doLogin" method="post">
        用户名：<input type="text", name="username" /><br>
        密码：<input type="password", name="password" /><br>
        <input type="submit", value="提交">
    </form>
</body>
</html>

const http = require("http");
const url = require("url");
const ejs = require('ejs');  // cnpm install egs --save
const querystring = require('querystring');

http.createServer(function(request, response){
	if (pathName == '/login'){
		// 渲染模板
		ejs.renderFile('./views/form.ejs', {}, function(err, content){
    		response.writeHead(200, {"Content-Type": "text/html;charset=utf-8"});
    		response.end(content);
    	})
	} else if (pathName == '/doLogin'){
        let postData = "";
        // 数据库接收中
        request.on('data', function(chunk){
            postData += chunk
        });
        // 数据库接收完毕，执行回调函数
        request.on('end', function(){
            console.log(querystring.parse(postData));
            response.end("post ok");
    } else {
		response.writeHead(404, {"Content-Type": "text/plain;charset=utf-8"});
		response.end("页面不存在");
	}
}).listen(8081);
console.log('Server runnng at http://127.0.0.1:8081/');