npm init -y(初始化项目)

npm install express（引入express）

npx express-generator -e（自动生成模板。添加对 ejs 模板引擎的支持）

npm i --save lodash（引入lodash）

app.js

var createError = require('http-errors');
var express = require('express');

var path = require('path');

var cookieParser = require('cookie-parser');

var logger = require('morgan');


//获取路由

var indexRouter = require('./routes/index');//模板自带

var usersRouter = require('./routes/users');//模板自带

var studentRouter = require('./routes/student');

var app = express();

// view engine setup //获取视图路径,_dirname是lodash里的获取文件目录

app.set('views', path.join(__dirname, 'views'));

app.set('view engine', 'ejs');

app.use(logger('dev'));

app.use(express.json());

app.use(express.urlencoded({ extended: false }));

app.use(cookieParser());

app.use(express.static(path.join(__dirname, 'public')));


//绑定路由

app.use('/index', indexRouter);

app.use('/users', usersRouter);

app.use('/', studentRouter);

// catch 404 and forward to error handler

app.use(function(req, res, next) {

  next(createError(404));

});

// error handler

app.use(function(err, req, res, next) {

  // set locals, only providing error in development

  res.locals.message = err.message;

  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page

  res.status(err.status || 500);

  res.render('error');

});

module.exports = app;

student.js

var express = require('express');

var router = express.Router();

const _=require("lodash");

let stus=[

  {id:202201,name:"tom",age:18},

  {id:202202,name:"rose",age:16},

  {id:202203,name:"jack",age:20},

  {id:202204,name:"lili",age:15},

  {id:202205,name:"lucy",age:15}

];

/* GET home page. */

router.get('/', function(req, res, next) {

  res.render('student', {stus,msg: '',stu:{id:"",name:"",age:""}});

});

router.get('/delete/:id', function(req, res, next) {

  //查找选中id的索引

  let index=_.findIndex(stus,{id:req.params.id})

  //删除

  stus.splice(index,1);

  res.render('student', {stus,msg: '删除成功！',stu:{id:"",name:"",age:""}});

});

//添加

router.post('/add', function(req, res, next) {

  //查找选中id的索引

  let stu=req.body;

  stus.push(stu);

  //根据编号排序

  let stus2=_.orderBy(stus,["id"]);

  stu.id=_.last(stus2).id+1;

  res.render('student', {stus,msg: '添加成功',stu:{id:"",name:"",age:""}});

});

//修改

router.get('/edit/:id', function(req, res, next) {

  //查找选中id的索引

  let stu=_.find(stus,{id:parseInt(req.params.id)})

  console.log(stus);

  res.render('student', {stus,msg: '',stu});

});

//更新

router.post('/update', function(req, res, next) {

  //查找选中id的索引

  let stuSubmit=req.body;

  let stu=_.find(stus,{id:parseInt(stuSubmit.id)})

  stu.name=stuSubmit.name;

  stu.age=stuSubmit.age;

  //重新渲染页面

  res.render('student', {stus,msg: '更新成功',stu:{id:"",name:"",age:""}});

});

module.exports = router;

student.ejs

<!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>学生管理系统</title>

</head>

<body>

    <h1>学生管理系统</h1>

    <table width="100%" border="1">

        <tr>

            <th>编号</th>

            <th>姓名</th>

            <th>年龄</th>

            <th>操作</th>

        </tr>

        <% for(let i=0;i<stus.length;i++){ %>

            <tr>

                <td><%=stus[i].id%></td>

                <td><%=stus[i].name%></td>

                <td><%=stus[i].age%></td>

                <td>

                    <a href="/delete/<%=stus[i].id%>" class="del">删除</a>

                    <a href="/edit/<%=stus[i].id%>">修改</a>

                </td>

            </tr>

        <%} %>

    </table>

    <fieldset>

        <legend>添加学生</legend>

        <form method="post">

            <p>

                <label>姓名：</label>

                <input type="text" name="name" value="<%=stu.name%>">

            </p>

            <p>

                <label>年龄：</label>

                <input type="text" name="age" value="<%=stu.age%>">

            </p>

            <input type="hidden" name="id" id="studentId" value="<%=stu.id%>">

            <button formaction="/add">添加</button>

            <button formaction="/update">更新</button>

        </form>

    </fieldset>

    <h4><%=msg%></h4>

    <script>

      let dels=document.querySelectorAll(".del");

      for(let i=0;i<dels.length;i++){

        dels[i].onclick=function(){

            return confirm("您确定要删除吗？");

        }

      }

    </script>

</body>

</html>

Node.js（五）学生管理CRUD的更多相关文章

  1. 4.Node.js 微信消息管理

    一.写在前面的话   当用户发送消息给公众号时(或某些特定的用户操作引发的事件推送时),会产生一个POST请求,开发者可以在响应包(Get)中返回特定XML结构,来对该消息进行响应.   消息推送也是 ...

  2. Node.js的安装以及Node.js的模块管理

    索引: Node.js的安装以及Node.js的模块管理Node.js开发环境搭建以及对ES6的支持Node.js构建Vue.js项目Vue.js单文件组件的开发基于Vue.js的UI组件(Eleme ...

  3. Node.js的进程管理

    众所周知Node基于V8,而在V8中JavaScript是单线程运行的,这里的单线程不是指Node启动的时候就只有一个线程,而是说运行JavaScript代码是在单线程上,Node还有其他线程,比如进 ...

  4. 使用yarn代替npm作为node.js的模块管理器

    使用yarn代替npm作为node.js的模块管理器 转 https://www.jianshu.com/p/bfe96f89da0e     Fast, reliable, and secure d ...

  5. 90%的人都不知道的Node.js 依赖关系管理（下）

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文参考:https://dzone.com/articles/node-dependency-manage ...

  6. Node.js 安装与管理

    一.node安装 Windows下,官网下载 Node.js 安装包,运行安装即可, 安装成功后,可查看版本号 node -v 二.npm npm 是 node 包管理工具,随同node一起安装,安装 ...

  7. 90%的人都不知道的Node.js 依赖关系管理（上）

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文参考:https://dzone.com/articles/nodejs-dependency-mana ...

  8. 关于node.js的进程管理

    如果是单纯的运行一个node进程,那会比较简单,例如: node ./example.js 但是一般来说,当我们运行一个node进程之后,我们可能希望对这个进程进行更多的管理,例如,当node程序是一 ...

  9. [Web 前端] 使用yarn代替npm作为node.js的模块管理器

    cp from : https://www.jianshu.com/p/bfe96f89da0e     Fast, reliable, and secure dependency managemen ...

随机推荐

  1. super和访问权限修饰符

    super()方法 构造方法中的super关键字 在java子类的构造方法中可以通过super关键字来调用父类的构造方法 super():访问父类中的无参构造函数 super(...)访问父类中的成员 ...

  2. odoo14 button 事件调用python方法如何传递参数

    1 <field name="user_ids" 2 mode="kanban" 3 nolabel="1" 4 options=&q ...

  3. Odoo14 ir.actions.act_window

    xml声明 1 <record id="res_company_user_action" model="ir.actions.act_window"> ...

  4. 论文解读（SEP）《Structural Entropy Guided Graph Hierarchical Pooling》

    论文信息 论文标题:Structural Entropy Guided Graph Hierarchical Pooling论文作者:Junran Wu, Xueyuan Chen, Ke Xu, S ...

  5. 套接字传输（TCP简单使用）

  6. RabbitMQ 入门系列：3、基础含义：持久化、排它性、自动删除、强制性、路由键。

    系列目录 RabbitMQ 入门系列:1.MQ的应用场景的选择与RabbitMQ安装. RabbitMQ 入门系列:2.基础含义:链接.通道.队列.交换机. RabbitMQ 入门系列:3.基础含义: ...

  7. sftp服务器的搭建与连接

    在个人租用的vps上搭建sftp服务器并通过本机连接上去 本实验所需:Xshell(xshell中包含xftp).一台vps(windows系统) sftp是一种协议,即SSH File Transf ...

  8. MySQL数据库如何线上修改表结构

    一.MDL元数据锁 在修改表结构之前,先来看下可能存在的问题. 1.什么是MDL锁 MySQL有一个把锁,叫做MDL元数据锁,当对表修改的时候,会自动给表加上这把锁,也就是不需要自己显式使用. 当对表 ...

  9. JUC锁:核心类AQS源码详解

    目录 1 疑点todo和解疑 2 AbstractQueuedSynchronizer学习总结 2.1 AQS要点总结 2.2 细节分析 2.2.1 插入节点时先更新prev再更新前驱next 2.2 ...

  10. Zookeeper 分布式事务锁的使用

    使用Netflix的包 curator-recipes pom文件引入相关依赖 <dependency> <groupId>org.apache.zookeeper</g ...