纯JavaScript实现一个带cookie的学生管理系统

由来

之前写过一个Jsp&Servlet版本的学生管理系统。

发出来之后，有一个网友找我给他写JavaScript版本的，时间也过去很久了，我估摸着他那门课已经结束了，所以整理了一下代码，分享出来给有需要的人。

需求

只能使用JavaScript，不涉及任何后端语言，不涉及数据库。

需要实现的功能：

1、登录登出功能

2、对学生信息的增删改查

3、使用cookie记录当前登录用户的信息

成品截图

登录页

主页

添加学生

更新学生

实现思路

按照那位朋友的描述，大概是大学里的JS课程设计吧，老师可能想让他们把一些学的东西都用上，才出了这么一个题目。

首先要解决存储问题，不用数据库的话，只能写进本地文件或者内存了。

我的办法是，启动系统的时候，将初始数据加载进内存，然后对内存的数据增删改查即可。

cookie也是一个问题

直接打开一个html时，会以文件的方式打开，没有域（例如www.baidu,com等域名，或者127.0.0.1等ip），是存储不了cookie的

必须以“服务‘的方式打开。

vscode打开，导入项目，装一个插件“Live Server”

右击文件，选择Open With Live Server 运行。

将会以服务的方式运行这个项目，这么一来，就可以使用cookie啦

另外为了好看点，用了bootstrap的一些表单和按钮样式，这个基本忽略不计。

源码

源码已经放在码云上了，需要的自取：

https://gitee.com/DayCloud/student-manage-js

欢迎关注我的博客，不定期分享一些优质的原创项目，可用作毕业设计或者面试找工作~