一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第9天，点击查看活动详情。
学习插件的基本过程
熟悉官网,了解这个插件可以完成什么需求
- 看在线演示,找到符合自己需求的demo www.swiper.com.cn/demo/index.…
- 查看基本使用流程
www.swiper.com.cn/usage/index…
- 查看APi文档,去配置自己的插件
www.swiper.com.cn/api/index.h…
- 注意: 多个swiper同时使用的时候, 类名需要注意区分
例如：我们需要做一个轮播图案例
（1）查看网站提供的案例
（2）选定要设计案例
（3）查看加入案例的方法
（4）解压后，找到资源
（5）接下来将对应的css、html结构、js填入
(6)改属性变成我们想要的效果（API文档）
本地存储
1.1 本地存储特性
随着互联网的快速发展，基于网页的应用越来越普遍，同时也变的越来越复杂，为了满足各种各样的需求，会经常性在
本地存储大量的数据，HTML5规范提出了相关解决方案。
1、数据存储在用户浏览器中
2、设置、读取方便、甚至页面刷新不丢失数据
3、容量较大，sessionStorage和localStorage约 5M 左右
1.2 localStorage
1、生命周期永久生效，除非手动删除 否则关闭页面也会存在
2、可以多窗口（页面）共享（同一浏览器可以共享）
- 以键值对的形式存储使用
存储数据：
localStorage.setItem(key, value)
获取数据：
localStorage.getItem(key)
删除数据：
localStorage.removeItem(key)
存储复杂数据类型存储
本地只能存储字符串,无法存储复杂数据类型.需要将复杂数据类型转换成JSON字符串,在存储到本地
JSON.stringify(复杂数据类型)
- 将复杂数据转换成JSON字符串 存储 本地存储中
JSON.parse(JSON字符串)
JSON.parse(localStorage.getItem('arr'))
- 将JSON字符串转换成对象
取出 时候使用
1.3 sessionStorage（了解）
- 生命周期为关闭浏览器窗口
- 在同一个窗口(页面)下数据可以共享
- 以键值对的形式存储使用
- 用法跟localStorage 基本相同
data-id控制
