1、网站

  https://ejs.co/

  https://ejs.bootcss.com/

2、app.js

var http=require("http");
var ejs = require('ejs');
var path = require('path'); http.createServer(function(req, res){ if (req.url === '/index') {
res.writeHead(200,{
"content-type":"text/html;charset=utf-8"
}) var people = ['geddy', 'neil', 'alex'];
var html = ejs.render('<h2 style="color:red"><%= people.join(", "); %></h2>', {people: people}); res.write(html);
res.end()
} if (req.url === '/detail') {
res.writeHead(200,{
"content-type":"text/html;charset=utf-8"
}) var book = {id: 1, name: '小明', price: 10.00};
ejs.renderFile(path.join(__dirname, 'pages', 'detail.html'), {book: book}, function(err, str) {
res.write(str);
res.end()
}); }     if (req.url === '/list') {
        res.writeHead(200,{
            "content-type":"text/html;charset=utf-8"
        })
        
     // 注意 bookList 的格式 "id" "name"的双引号不能省
        var bookList = [{"id": 1, "name": "java编程思想", "price": 10.00},{"id": 2, "name": "springboot", "price": 20.00}];
        ejs.renderFile(path.join(__dirname, 'pages', 'list.html'), {bookList: bookList}, function(err, str) {
            res.write(str);
            res.end()
        });
    } }).listen('3000', function() {
console.log('服务器已经启动,请访问http://127.0.0.1:3000/');
});

  pages/detail.html

<!DOCTYPE html>
<html>
<head>
<title>detail页面</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="/static/css/common.css">
</head>
<body>
<h2>detail页面</h2>
<form method="post" action="/edit">
<input type="hidden" name="id" value="<%= book.id %>">
书名:<input type="text" name="name" value="<%= book.name %>"><br/>
价格:<input type="text" name="price" value="<%= book.price %>"><br/>
<input type="submit" value="修改">
</form>
</body>
</html>

  pages/list.html

<!DOCTYPE html>
<html>
<head>
<title>list页面</title>
<meta charset="utf-8">
</head>
<body>
<h2>list页面</h2>
<ul>
<% for(var i = 0; i < bookList.length; i++) { %>
<li><%= bookList[i].name %></li>
<% } %>
</ul>
</body>
</html>

模板引擎ejs的更多相关文章

  1. 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍

    动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...

  2. 模板引擎ejs入门学习

    1:利用 NPM 安装 EJS 很简单 npm install ejs 2:安装完成肯定就是使用了 var template = ejs.compile(str, options); template ...

  3. 模板引擎ejs详解

    singsingasong.js: const ejs=require('ejs'); ejs.renderFile('./views/singsingasong.ejs', {'name':'sin ...

  4. nodejs 模板引擎ejs的使用

    1.test.ejs文件 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  5. 模板引擎ejs的include方法

    html无法include header.ejs footer.ejs 最后用 user.ejs在首尾include

  6. nodejs 模板引擎ejs的简单使用

    ejs1.js /** * Created by ZXW on 2017/11/9. */ var ejs=require('ejs'); ejs.renderFile("},functio ...

  7. nodejs 模板引擎ejs的简单使用(3)

    1.ejs <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  8. nodejs 模板引擎ejs的简单使用(2)

    test.ejs <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  9. nodeJs学习-10 模板引擎 ejs语法案例

    ejs语法案例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...

随机推荐

  1. CF The World Is Just a Programming Task (Easy Version)【分析·思维】

    题目传送门 题意: 给定一个括号序列,随意交换两个位置的括号之后,问有多少个不同长度的圈.关于圈的定义大概就是:将括号序列的后$k$个数放到括号序列的最前面,就是长度为$k$的圈.(看了好久题意emm ...

  2. illustrator 偏方

    视图 边角构件  - - 这个是显示边角弧度的

  3. P1216数字三角形

    这是USACO的一道记忆化搜索题,还记得原来学搜索就是被此所困. 给定n深的数,第i层有i个节点,存储有一个数字,询问从第一层走到最后一层所经过节点上数字和的最大值.我们很容易想到枚举所有路径来计算最 ...

  4. Android尺寸适配问题

    1, 布局与组件大小用dp,文字大小用sp 2,

  5. python——元组方法及字符串方法

    元组方法 Tup.count():计算元组中指定元素出现的次数 Tup.count('c') Tup.index():在元组中从左到右查找指定元素,找到第一个就返回该元素的索引值 Tup.index( ...

  6. js中this.index使用

    上面圈出的那句没有执行,因为this.index 是undefined,(也不能直接使用i取代this.index,原因是i不是变化的值,使用alert打印输出的i值始终为3) 解决方式:在for语句 ...

  7. 2019icpc徐州网络赛

    A Who is better? 题意 excrt+斐波那契博弈 分析 Java的BigInteger对象默认为null,不能直接比较. 代码 import java.math.BigInteger; ...

  8. 11.AutoMapper 之值转换器(Value Transformers)

    https://www.jianshu.com/p/b77311546e64 值转换器(Value Transformers) 值转换器应用于单一类型的转换.AutoMapper在分配值之前,会检测该 ...

  9. wex5 如何导包

    wex5中 导jar包 要先把jar文件放在: E:\WeX5\runtime\BaasServer\WEB-INF\lib目录中(我wex5放的是E盘) 点击项目 --> 属性 --> ...

  10. SecureCRT文件和文件夹显示不同颜色(像linux中那样效果)

    如何设置secureCRT使用的他可以像linux文件和文件夹显示不同的颜色呢 原先显示效果如下: 效果图 配置