二十一、Node.js-EJS 模块引擎
初识 EJS 模块引擎
我们学的 EJS 是后台模板,可以把我们数据库和文件读取的数据显示到 Html 页面上面。它
是一个第三方模块,需要通过 npm 安装
https://www.npmjs.com/package/ejs
大家可以在上面的网站获取到ejs的使用说明
安装:
npm install ejs –save / cnpm install ejs --save
Nodejs 中使用:
下面使用代码简单的展示出后台数据渲染在前台页面的过程,今后会慢慢的补充其他细节
项目结构:
创建服务的00service03_ejs.js代码:
var http = require("http")
var url = require("url")
var ejs = require('ejs')
http.createServer(function (req, res) {
res.writeHead(200, {"Content-Type": "text/html;charset='utf-8'"})
var allUrl = req.url;
var path = url.parse(allUrl).pathname;
var str = '我是后台数据,将来我是从数据库读出来的'
var list =[
'1111',
'2222',
'3333'
]
var labelStr='<h2>我是html标签h2包裹的内容</h2>';
if (path == "/login") {
// 把后台(数据库)的数据渲染到模板上面
ejs.renderFile(//这里我们通过ejs.renderFile()方法将后台数据输送给前台页面
/**
* ejs.renderFile()方法一共有三个参数:
*/
//参数1:我们要输出后台数据的目标页面路径:
"views/login.ejs",//这里的login.ejs,其实就是login.html,在下面的补充内容我会补充介绍
//参数2:我们需要输出的数据,以对象的形式输出:
{
msg: str,
list: list,
labelStr:labelStr
},
//参数3:回调函数,输出数据之后我们会获取到渲染了我们后台数据的页面内容data
function (err, data) {
res.end(data)//然后我们将data输出到浏览器,我们的页面就可以展示出来了
});
} else if (path == "/register") {
res.end("register")
} else if (path == "/admin") {
res.end("admin")
}
}).listen(8000)
login.ejs代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>这是一个ejs后台模板引擎登录</h1>
<!--<%= %>输出标签(原文输出 HTML 标签)(就是后台传什么数据,我就展示什么数据,不会解析html标签-->
<h1><%=msg%>></h1>
<!--<% %>流程控制标签:里面可以书写我们的js代码逻辑-->
<%for (var i=0;i<list.length;i++){%>
<li><%=list[i]%></li>
<%}%>
<%=labelStr%>
<!--<%- %>输出标签(HTML标签会被浏览器解析)-->
<%-labelStr%>
</body>
</html>
访问页面效果:
.ejs文件补充了解:
点击下方链接:
https://www.cnblogs.com/luzhanshi/p/10769867.html
二十一、Node.js-EJS 模块引擎的更多相关文章
- Node.js的模块载入方式与机制
Node.js中模块可以通过文件路径或名字获取模块的引用.模块的引用会映射到一个js文件路径,除非它是一个Node内置模块.Node的内置模块公开了一些常用的API给开发者,并且它们在Node进程开始 ...
- node.js基础模块http、网页分析工具cherrio实现爬虫
node.js基础模块http.网页分析工具cherrio实现爬虫 一.前言 说是爬虫初探,其实并没有用到爬虫相关第三方类库,主要用了node.js基础模块http.网页分析工具cherri ...
- Node.js的安装以及Node.js的模块管理
索引: Node.js的安装以及Node.js的模块管理Node.js开发环境搭建以及对ES6的支持Node.js构建Vue.js项目Vue.js单文件组件的开发基于Vue.js的UI组件(Eleme ...
- Node.js之模块机制
> 文章原创于公众号:程序猿周先森.本平台不定时更新,喜欢我的文章,欢迎关注我的微信公众号. ![file](https://img2018.cnblogs.com/blog/830272/20 ...
- Node.js Web模块
什么是Web服务器? Web服务器是处理由HTTP客户端发送的,如web浏览器的HTTP请求的软件应用程序,并返回响应于客户端网页. Web服务器通常伴随着图片,样式表和脚本的HTML文档. 大多数W ...
- Node.js工具模块
在Node.js的模块库中提供实用的模块数量. 这些模块都是很常见的,并同时开发基于任何节点的应用程序频繁使用. S.N. 模块的名称和说明 1 OS Module提供基本的操作系统相关的实用功能 2 ...
- Node.js:模块
概要:本篇博客主要介绍node.js的模块 1.创建模块 在node.js中创建一个模块非常简单,因为一个文件就是一个模块.我们只需要明白如何从其他文件中获取这个模块.Node.js提供了 expor ...
- node.js之模块
node.js之模块 1.自定义模块的设置 加载自定义模块利用require: eg: require('./custom_module.js') 2.从模块外部访问模块内的成员 2.1使用expor ...
- Node.js DNS 模块
Node.js DNS 模块用于解析域名.引入 DNS 模块语法格式如下: var dns = require("dns") 方法 序号 方法 & 描述 1 dns.loo ...
- Node.js Net 模块
Node.js Net 模块提供了一些用于底层的网络通信的小工具,包含了创建服务器/客户端的方法,我们可以通过以下方式引入该模块: var net = require("net") ...
随机推荐
- An Intuitive Explanation of Fourier Theory
Reprinted from: http://cns-alumni.bu.edu/~slehar/fourier/fourier.html An Intuitive Explanation of Fo ...
- 第一个Django应用程序_part3
一.概述 此文延续第一个Django应用程序part2. 官方文档:https://docs.djangoproject.com/en/1.11/intro/tutorial03/ view是Djan ...
- Python tkinter 副窗体置顶和取消置顶
root = Tk() #置顶root.wm_attributes('-topmost',1) #取消置顶 root.wm_attributes('-topmost',0)
- CTE 中字符串拼接
1>cte语法 1.1>基础语句和递归语句中必须有字段 1.2>最后只能跟一条查询语句 1.3>字符串拼接,要将拼接的字段转成字符串类型,cast(fieldName as n ...
- avalonjs 笔记
1>复选卡框和单选框 复选卡框 监控已选框的数组,即通过属性监控来判断是否全选 <div ms-controller="test"> <ul> < ...
- easyui页签更新
1.首先引入这个js文件 <script src="/Scripts/tabs.js" type="text/javascript"></sc ...
- echo $[1 + 2] shell中 $[] 在bash中同$(()),用于算术计算
shell脚本编写:echo $[ 11#8+1] 输出结果是几,为什么,怎么算来的? 摘自:https://zhidao.baidu.com/question/334766451.html 结 ...
- hdu 4946 Area of Mushroom (凸包,去重点,水平排序,留共线点)
题意: 在二维平面上,给定n个人 每个人的坐标和移动速度v 若对于某个点,只有 x 能最先到达(即没有人能比x先到这个点或者同时到这个点) 则这个点称作被x占有,若有人能占有无穷大的面积 则输出1 , ...
- u盘安装Linux系统详细教程
2012-05-06 02:30:44 分类: LINUX 想不想体验一下Linux下呢?刻盘太浪费钱,而U盘却可以多次利用.本文就是要介绍如何通过U盘安装Linux系统的.只要用Universal- ...
- 实践作业4:Web测试实践(小组作业)每日任务记录1
会议时间:2017年12月21日会议地点:东九教学楼自习区主 持 人:王晨懿参会人员:王晨懿.余晨晨.郑锦波.杨潇.侯欢.汪元记 录 人:王晨懿会议议题:小组作业熟悉和任务分配 (一)选择待测产品 我 ...