jQuery实现动态添加和删除（点击按钮添加在页面添加和删除元素）
1：点击添加按钮弹出弹框，form表单可以填写相关的信息
2：点击保存按钮，相关信息会显示在界面的列表里
文章图片
3：鼠标滑动界面列表的标签，会出现删除按钮的图标，点击删除成功
文章图片
4：代码如下，可以根据需要自行修改（可能会有多余的代码，但是不会影响效果）
- 锐客网
#div_add {
background: #66b7f9;
color: #ffffff;
border: none;
display: block;
height: 30px;
margin: 20px 0;
}#div_body p {
height: 40px;
border: 1px solid #c0c0c0;
line-height: 40px;
text-align: center;
}#div_body img {
width: 18px;
height: 18px;
margin-top: 9px;
float: right;
}#div_body p:hover {
background: #66b7f9;
color: #ffffff;
}.leftpage {
height: 500px;
background: #ffffff;
}#adduse {
display: none;
width: 500px;
height: 300px;
border: 1px solid #c0c0c0;
background: #ffffff;
position: absolute;
left: 50%;
top: 20%;
}#adduse p {
padding-left: 15px;
}.addusep {
background: #f2f2f2;
height: 30px;
line-height: 30px;
padding-left: 5px;
}#adduse p:nth-child(2) {
padding-top: 25px;
}#adduse p:nth-child(6) {
padding-bottom: 25px;
}#cancle {
margin-left: 66px;
background: #428bca;
color: #ffffff;
border: none;
width: 60px;
height: 30px;
}#save {
margin-left: 36px;
background: #428bca;
color: #ffffff;
border: none;
width: 60px;
height: 30px;
}原文作者：祈澈姑娘 技术博客：https://www.jianshu.com/u/05f416aefbe1
90后前端妹子，爱编程，爱运营，爱折腾。坚持总结工作中遇到的技术问题，坚持记录工作中所所思所见，对于博客上面有不会的问题，可以加入qq群聊来问我：473819131。
推荐阅读
- 关于QueryWrapper|关于QueryWrapper,实现MybatisPlus多表关联查询方式
- MybatisPlus使用queryWrapper如何实现复杂查询
- python学习之|python学习之 实现QQ自动发送消息
- 事件代理
- 孩子不是实现父母欲望的工具——林哈夫
- opencv|opencv C++模板匹配的简单实现
- Node.js中readline模块实现终端输入
- java中如何实现重建二叉树
- 人脸识别|【人脸识别系列】| 实现自动化妆
- paddle|动手从头实现LSTM