node.js 的页面渲染方法ejs
、安装依赖的组件
npm i consolidate -D
npm i ejs -D
2、布局服务端
const express = require('express');
const consolidate = require('consolidate');
let server = express();
server.listen(8087);
//选择一种模板引擎
server.engine('html', consolidate.ejs);
//设置模板文件的扩展名
server.set('view engine', 'ejs');
//指定模板文件的路径，同时在根目录下建www文件夹目录
server.set('views', './www');
server.get('/list', (req, res) => {
//渲染list.ejs文件
res.render('list', {data: ['aaaa', 'bbbb', 'cccc', 'dddd', 'eeeee']});
})
3、前端布局
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!--这是一个公共的部份-->
<!--注意:这里面的include里面也是不包含www这级目录的-->
<%-include('./header.ejs') %>
<p>这是一个列表</p>
<%if(data.length>0){%>
<ul>
<%for(let i=0;i<data.length;i++){ -%>
<li><%=data[i]%></li>
<%}%>
</ul>
<%}-%>
<!--注意:
<% %> =>放置javascript代码
<%= %> =>放置变量
<% -%> =>不换行输出
<%- %> =>解析成html代码
-->
</body>
</html>
最后显示的结果
node.js 的页面渲染方法ejs的更多相关文章
- Node.js静态页面展示例子2
例程下载:https://files.cnblogs.com/files/xiandedanteng/nodejsStaticHtmlSample.rar 页面效果: Html页面代码(注意用文本编辑 ...
- Node.js 手册查询-4-Express 方法
express 标签(空格分隔): node.js express [TOC] 安装: 新版本中命令行工具分家了 npm install -g express //安装 express 然后 npm ...
- Node.js 手册查询-5-Ejs 方法
express 中使用 //设置模板目录 app.set('views', path.join(__dirname, 'views')); //设置模板引擎 app.set('view engine' ...
- Node.js原生及Express方法实现注册登录原理
由于本文只是实现其原理,所以没有使用数据库,只是在js里面模拟数据库,当然是种中还是需要用数据库的. 1.node.js原生方法 ①html页面,非常简单,没有一丝美化~我们叫它user.html & ...
- vue中通过js控制页面样式方法
在使用vue.js框架的时候,有时候会希望在页面渲染完成之后,再执行函数方法来处理初始化相关的操作,如果只处理页面位置.宽或者高时,必须要在页面完全渲染之后才可以,页面没有加载完成之前,获取到的宽高不 ...
- Node.js 手册查询-3-Mongoose 方法
Mongoose 参考手册 标签(空格分隔): MongoDB Mongoose 是什么? 一般我们不直接用MongoDB的函数来操作MongoDB数据库 Mongose就是一套操作MongoDB数据 ...
- 在CentOS 7上安装Node.js的4种方法（yum安装和源码安装）
CentOS 7上的安装方法,其中涵盖了源码安装,已编译版本安装,EPEL(Extra Packages for Enterprise Linux)安装和通过NVM(Node version mana ...
- 在CentOS 7上安装Node.js的4种方法（包含npm）
Node.js和Javascript有着千丝万缕的联系,可以说Node.js让Javascript显得从未如此强大.好吧…微魔其实是个门外汉…但是这并不能阻碍微魔学习探索未知的信心~今天在国外闲逛,看 ...
- JS实现页面刷新方法
下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...
随机推荐
- java 写 Excel（不生成实体文件，写为流的形式）
java 写 Excel(不生成实体文件,写为流的形式) public String exportReportExcel(String mediaCode, List<SimpleMediaRe ...
- Django REST framework 第一章 Serialization
此章节将会介绍多种构成REST framework的重要模块,在每个部分如何一起配合上提供一个综合的全方面的了解. 准备 同样的创建一个新项目,创建一个新的app,将rest_framework跟新建 ...
- Linux查看系统的基本信息
uname -r :显示操作系统的发行版号 uname -a:显示系统名.节点名称.操作系统的发行版号.操作系统版本.运行系统的机器 ID 号. # Ubuntu系统 ubuntu@VM-28-69- ...
- python 实现神经网络算法
注: Scratch是一款由麻省理工学院(MIT) 设计开发的一款面向少年的简易编程工具.这里写链接内容 本文翻译自“IMPLEMENTING A NEURAL NETWORK FRO ...
- 【转】Python 面向对象（初级篇）
[转]Python 面向对象(初级篇) 51CTO同步发布地址:http://3060674.blog.51cto.com/3050674/1689163 概述 面向过程:根据业务逻辑从上到下写垒代码 ...
- Python3-操作系统发展史
操作系统发展史 手工操作 —— 穿孔卡片 批处理 —— 磁带存储 多道程序系统 操作系统的作用 手工操作 —— 穿孔卡片 1946年第一台计算机诞生--20世纪50年代中期,计算机工作还在采用手工操作 ...
- Nginx 开启目录下载
平时应用中,我们大都用apache搭建下载页面.毕竟Apache搭建起来非常方便,yum安装,创建目录就可以了. 但有时还是需要用nginx配置下载页面.这里就是一个简单的配置nginx下载页面的过程 ...
- 利用shell简单监控网络设备的接口状态发出告警
作者:邓聪聪 #!/bin/sh Date=$(date +%F_%T) iplist=`cat ip.txt |awk '{print $1}'` snmp="hjsz-snmp" ...
- requests库入门13-会话对象
会话对象可以在跨请求保持某些参数,会话对象有requests api的大部分方法,我理解会话对象就是一个资源共享池 使用requests.Session()可以创建会话对象的实例 还是以之前GitHu ...
- linux系统网络相关问题
暂时将你的 eth0 这张网络卡的 IP 设定为 192.168.1.100 ,如何进行? ifconfig eth0 192.168.1.100 我要增加一个路由规则,以 eth0 连接 192.1 ...