node插件express(路由)的插件使用(二)——body-parser和ejs插件的基本使用
文章目录
- 前言
- 一、express使用中间件body-parser获取请全体的数据
- 1. 代码
- 2. 效果
- 二、express使用ejs(了解即可)
- 1.安装
- 2.作用
- 3.基本使用
- (1)代码
- (2)代码分析和效果
- 4.列表渲染
- (1)代码
- (2)代码分析和效果
- 5.if的条件渲染
- (1)代码
- (2)代码分析和效果
前言
提示:希望你了解express后进行查看后面的内容。
一、express使用中间件body-parser获取请全体的数据
1. 代码
// 1:导入express body-parser
const express = require('express')
const bodyParser = require('body-parser')// 2:创建应用对象
const app = express();// 3:解析querystring格式请全体的中间件
const urlenncodeParser = bodyParser.urlencoded({extended: false})// 5:创建路由规则
app.get('/login', (req, res) => {// 6:响应html文件res.sendFile(__dirname + '/06_index.html')
})// 7:post规则(点击html页面的登录触发回调函数)
app.post('/login', urlenncodeParser, (req, res) => {console.log(req.body); // 获取用户名和密码res.send('获取用户数据')
})// 4:监听并启动服务器
app.listen(9000, () => {console.log('服务器启动了')
})
2. 效果

二、express使用ejs(了解即可)
ejs 中文官网:https://ejs.bootcss.com/#install
1.安装
npm install ejs
2.作用
将html页面和js逻辑拆分开来,
3.基本使用
(1)代码
js 文件
// 1:导入express body-parser
const fs = require('fs')
const ejs = require('ejs')const name = '张三'
const age = 18let str = fs.readFileSync('./07_.html').toString();/*** ejs.render* str, data, options* @str str 参数1,渲染的html页面* @data Object 参数2,传递给html页面的参数* @options 参数3,配置* 作用:输出渲染后的 HTML 字符串*/let renderStr = ejs.render(str, { name: name, age: age });console.log(renderStr);
html 文件
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ejs初体验</title>
</head>
<body><h1>我是 <%= name %>, 今年<%= age %> 岁</h1>
</body>
</html>
(2)代码分析和效果

4.列表渲染
(1)代码
js 文件
// 1:导入express body-parser
const fs = require('fs')
const ejs = require('ejs')const nameList = ['张三', '李四', '王五', '赵六']let html = fs.readFileSync('./08_.html').toString();let renderStr = ejs.render(html, { nameList: nameList });console.log(renderStr);
html 文件
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ejs列表渲染</title>
</head>
<body><% nameList.forEach(item => { %><li><%= item %></li><% }) %>
</body>
</html>
(2)代码分析和效果

5.if的条件渲染
(1)代码
js 文件
// 1:导入express body-parser
const fs = require('fs')
const ejs = require('ejs')const isEat = true;let html = fs.readFileSync('./09_.html').toString();let renderStr = ejs.render(html, { isEat: isEat });console.log(renderStr);
html 文件
<body><header><% if(isEat){ %><span>我吃了饭</span><% }else{ %><span>我还没吃饭</span><% } %></header>
</body>
(2)代码分析和效果

相关文章:
node插件express(路由)的插件使用(二)——body-parser和ejs插件的基本使用
文章目录 前言一、express使用中间件body-parser获取请全体的数据1. 代码2. 效果 二、express使用ejs(了解即可)1.安装2.作用3.基本使用(1)代码(2)代码分析和效果 4.列表渲染(1)代码…...
学习c++的第十天
目录 类 & 对象 类定义 对象的建立和使用 构造函数(Constructor) 析构函数(Destructor) 拷贝构造函数 扩展知识 this指针 友元函数的使用方法 友元类的使用方法 常数据的使用及初始化 类 & 对象 什么是类?什么是对象?对于面向对象的…...
895. 最长上升子序列
题目: 895. 最长上升子序列 - AcWing题库 思路:dp 代码: #include<iostream> #include<cstdio> #include<cmath> using namespace std; typedef long long ll; const int N1010; int f[N];//表示以i结尾的最大上升子序列…...
岩土工程铁路桥梁监测中智能振弦传感器的应用方案
岩土工程铁路桥梁监测中智能振弦传感器的应用方案 智能振弦传感器是近年来岩土工程和桥梁监测领域的重要技术之一。它具有高灵敏度、高精度、高可靠性等优点,并且能够实时对结构物振动进行监测和分析。本文针对岩土工程铁路桥梁监测中智能振弦传感器的应用方案进行…...
【数智化人物展】觉非科技CEO李东旻:数据闭环,智能驾驶数智时代发展的新引擎...
李东旻 本文由觉非科技CEO李东旻投递并参与《2023中国企业数智化转型升级先锋人物》榜单/奖项评选。 大数据产业创新服务媒体 ——聚焦数据 改变商业 数智化的主要作用是帮助决策。它的核心是大数据,以大数据为基础,匹配合适的AI技术,促使数…...
字符型液晶显示器LCD 1602的显示控制(Keil+Proteus)
前言 趁机把LCD 1602的实验完成了,那个电路图有几个地方没弄懂,但是去掉也没有报错,就没管了。 LCD1602_百度百科 (baidu.com)https://baike.baidu.com/item/LCD1602/6014393?frge_ala LCD1602液晶显示屏通过电压来改变填充在两块平行板之…...
为什么我学了几天 STM32 感觉一脸茫然?
今日话题,为什么我学了几天 STM32 感觉一脸茫然?从51单片机过渡到STM32,首先需要理解“单片机”究竟是什么,编程语言虽然重要,但也需要深入理解。51单片机的控制相对简单,基本是函数调用,通过给…...
DC-DC降压芯片120V转12V5A大功率SL3038电源芯片
本文将介绍一款DC-DC降压芯片,将120V的电压转换为12V5A的大功率输出,使用SL3038电源芯片实现。在开始介绍之前,我们先来了解一下DC-DC降压芯片和SL3038电源芯片的基本原理和特点。 DC-DC降压芯片是一种常见的电源管理芯片,它可以将…...
CE认证木质玩具TUME外贸出口测试报告解析
木制玩具,顾名思义,使用木制原料制成的玩具。木制玩具具有牢固耐玩、安全卫生,摔不碎,不生锈,无锋利棱角的特点。深受大家的喜爱。木质玩具出口需办理CE认证。 CE认证是一种安全认证标志,代表欧盟认可的&a…...
oracle_19c 安装
oracle安装部署 1、安装docker,docker-compose环境。 curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun curl -L "https://github.com/docker/compose/releases/download/1.14.0-rc2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/b…...
随时随地时时刻刻使用GPT类应用
疑问 很多人说GPT的广泛使用可能会使人们失业,会对一些互联网公司的存活造成挑战,那么这个说法是真的吗? 这个说法并不完全准确。虽然GPT等AI技术的广泛应用可能会对某些行业和职业产生影响,但并不意味着它会导致人们失业或互联网…...
运动检测辅助系统
运动检测辅助系统是一种结合了传感器技术、数据处理技术和智能算法的系统,旨在帮助用户监测、评估和改善其运动行为及健康状况。这类系统通常利用多种传感器(如运动传感器、摄像头、心率监测器等)采集用户的运动数据,并通过数据处…...
0002Java安卓程序设计-基于Uniapp+springboot菜谱美食饮食健康管理App
文章目录 开发环境 《[含文档PPT源码等]精品基于Uniappspringboot饮食健康管理App》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功 编程技术交流、源码分享、模板分享、网课教程 🐧裙:776871563 功能介绍ÿ…...
LeetCode算法题解(回溯)|39. 组合总和、40. 组合总和 II、131. 分割回文串
一、39. 组合总和 题目链接:39. 组合总和 题目描述: 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target ,找出 candidates 中可以使数字和为目标数 target 的 所有 不同组合 ,并以列表形式返回。你可以按 任意…...
基于springboot实现招聘信息管理系统项目【项目源码+论文说明】
基于springboot实现招聘信息管理系统演示 摘要 在Internet高速发展的今天,我们生活的各个领域都涉及到计算机的应用,其中包括招聘信息管理系统的网络应用,在外国招聘信息管理系统已经是很普遍的方式,不过国内的线上管理系统可能还…...
Freeswitch实现软电话功能
1.话务步骤 分机注册->登录->拨打电话-> /*<--注册分机-->*/ EslMessage eslMessage1 inboundClient.sendApiCommand("callcenter_config agent set contact", "21009default user/1000"); System.out.println("#####dial eslMessa…...
RMI初探
接口 import java.rmi.Remote; import java.rmi.RemoteException;public interface IFoo extends Remote {String say(String name) throws RemoteException; }import java.rmi.Remote; import java.rmi.RemoteException;public interface IBar extends Remote {String buy(Str…...
NLP之BM25:BM25算法的简介、相关库、案例应用之详细攻略
NLP之BM25:BM25算法的简介、相关库、案例应用之详细攻略 目录 相关文章 NLP之BM25:BM25算法的简介、相关库、案例应用之详细攻略 Py之rank_bm25:rank_bm25的简介、安装、使用方法 BM25算法的简介...
YOLOv5改进,全维动态卷积
目录 一、理论部分 网络结构 实验结果 二、应用到YOLOv5 代码 yaml配置文件...
TypeScript学习Ts的类型声明,关于类
TypeScript是什么? 以JavaScript为基础构建的语言一个JavaScript的超集可以在任何支持JavaScript的平台上执行TypeScript扩展了JavaScript并添加了类型TS不能被JS解析器直接执行 TypeScript开发环境搭建 下载Node.js安装Node.js使用npm全局安装TypeScript&#x…...
PSO-Transformer分类预测Matlab代码:基于粒子群优化算法优化Transfor...
PSO-Transformer分类 Matlab代码 基于粒子群优化算法(PSO)优化Transformer的数据分类预测(可以更换为单、多变量时序预测/回归,前私我),Matlab代码,可直接运行,适合小白新手 程序已经调试好,无需更改代码替换数据集即可…...
3000+开源蓝图:革新性一站式戴森球计划工厂解决方案
3000开源蓝图:革新性一站式戴森球计划工厂解决方案 【免费下载链接】FactoryBluePrints 游戏戴森球计划的**工厂**蓝图仓库 项目地址: https://gitcode.com/GitHub_Trending/fa/FactoryBluePrints 面对戴森球计划中错综复杂的生产线布局,你是否曾…...
从DBC到CAPL全流程避坑指南:BusType设置对自动化测试的影响
从DBC到CAPL全流程避坑指南:BusType设置对自动化测试的影响 在汽车电子测试领域,DBC文件如同CAN网络的"基因图谱",而CAPL脚本则是激活这些基因的"酶"。当两者配合出现问题时,往往不是基因突变,而是…...
终极指南:如何永久解决IDM激活弹窗问题 - 完整技术方案
终极指南:如何永久解决IDM激活弹窗问题 - 完整技术方案 【免费下载链接】IDM-Activation-Script IDM Activation & Trail Reset Script 项目地址: https://gitcode.com/gh_mirrors/id/IDM-Activation-Script Internet Download Manager(IDM&a…...
5分钟掌握OptiScaler:让所有显卡都能享受DLSS级画质的免费神器
5分钟掌握OptiScaler:让所有显卡都能享受DLSS级画质的免费神器 【免费下载链接】OptiScaler DLSS replacement for AMD/Intel/Nvidia cards with multiple upscalers (XeSS/FSR2/DLSS) 项目地址: https://gitcode.com/GitHub_Trending/op/OptiScaler 还在为显…...
实战演练:基于ClaudeCode与快马平台构建博客评论交互组件
最近在开发个人博客网站时,遇到了一个常见需求:需要为每篇文章添加评论功能。这个看似简单的模块,实际上涉及不少细节处理。经过一番摸索,我发现在InsCode(快马)平台上结合ClaudeCode的智能生成能力,可以高效完成这个任…...
从Sketchfab下载的glTF模型怎么用?手把手教你用Assimp 5.3.1在Visual Studio 2022里解析《蔚蓝档案》角色数据
从Sketchfab下载的glTF模型实战解析:用Assimp 5.3.1提取《蔚蓝档案》角色数据 当你在Sketchfab上发现一个精美的《蔚蓝档案》角色模型,下载glTF格式文件后,接下来该怎么办?本文将带你从零开始,使用Assimp 5.3.1库在Vi…...
七牛云CDN加速+HTTPS配置全攻略(阿里云域名解析实战)
七牛云CDN加速HTTPS配置全攻略(阿里云域名解析实战) 当你的网站访问速度开始影响用户体验,或是浏览器频繁弹出"不安全"警告时,CDN加速和HTTPS配置就成了刚需。七牛云作为国内领先的云服务商,提供了从存储到…...
Codesys实战排障手记:从证书过期到RTC时钟校准
1. 当Codesys突然弹出证书过期警告时 那天我正在客户现场调试禾川HCQ1系列PLC,刚打开Codesys V3.5开发环境,一个鲜红的证书过期警告就弹了出来。这种突如其来的报错让现场气氛瞬间紧张——产线等着调试,设备等着联调,而系统却在关…...
MoneyPrinterPlus未来路线图深度解析:AI短视频生成工具的终极进化指南 [特殊字符]
MoneyPrinterPlus未来路线图深度解析:AI短视频生成工具的终极进化指南 🚀 【免费下载链接】MoneyPrinterPlus 使用AI大模型技术,一键批量生成各类短视频,自动批量混剪短视频,自动把视频发布到抖音,快手,小红书,视频号上,赚钱从来没有这么容易过! Generat…...
