基于localStorage存储的极(jian)简(lou)备忘录

175 阅读1分钟

版本迭代说明

  • v1.0
    • 功能:实现基本的输入存储和勾选删除
    • 页面:实现基本的自适应页面设计
    • 待优化:
      • 功能上勾选后自动删除,暂没实现单独的删除功能和已完成待办;
      • 页面上未实现完全自适应,未设置最低宽度,确认按钮会有偏离,动画效果可以有较大优化空间; 先看成品图 image.png

实现的技术思路

1. 页面:

  • 利用flex进行自适应布局
  • 利用访问localStorage动态生成dom节点来处理备忘录事宜的动态变化
  • 采用循环遍历的方法对li节点遍历绑定勾选动画事件

2. 功能:

  • 采用localStorage保证数据的存储,不会关闭浏览器或页面就丢失数据。

遇到的细节

想要给一组标签绑定同样的事件的话需要遍历绑定,不过似乎记得有一种冒泡的写法,事件绑定到父容器上 <ul> ,具体不太清楚,先留个坑叭