Web前端开发学习笔记13-- 本地存储

1、本地存储

• 本地存储特性

1、数据存储在用户浏览器中

2、设置、读取方便，甚至页面刷新不丢失数据

3、容量较大，sessionStorage 约为 5M，localStorage 约 20M

4、只能存储字符串，可以将对象 JSON.stringify() 编码后存储

1.1 window.sessionStorage

• 特性

1、生命周期为关闭浏览器窗口

2、在同一个窗口（页面）下数据可以共享

3、以键值对形式存储使用

• 存储数据

sessionStorage.setItem(key,value)

• 获取数据

sessionStorage.getItem(key)

• 删除数据

sessionStorage.removeItem(key)

• 删除所有数据

sessionStorage.clear()

1.2 window.localStorage

• 特性

1、声明周期永久生效，除非手动删除，否则关闭页面也会存在

2、可以对个窗口（页面）共享（同一浏览器可以共享）

3、以键值对的形式存在

• 存储数据

localStorage.setItem(key,value)

• 获取数据

localStorage.getItem(key)

• 删除数据

localStorage.removeItem(key)

• 删除所有数据

localStorage.clear()