sessionStorage、localStorage和cookie

sessionStorage

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

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

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

4、储存大小为5MB左右

存储数据：

sessionStorage.setItem(key,value)

获取数据：

sessionStorage.getItem(key)

删除数据：

sessionStorage.removeItem(key)

删除所有数据：

sessionStorage.clear()

localStorage

1、生命周期一直在缓存当中，除非手动删除（清理缓存）否则关闭页面也会存在

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

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

4、储存大小为5MB左右

存储数据：

localStorage.setItem(key,value)

获取数据：

localStorage.getItem(key)

删除数据：

localStorage.removeItem(key)

删除所有数据：

localStorage.clear()

 cookie

1、声明周期可以自己设置，默认是浏览器关闭后生效

2、参与服务器端的通信

3、读写较为繁琐 容量较小在4KB

创建和修改

document.cookie = "username = james harden"

可以声明一个过期时间 默认会在浏览器关闭时过期

document.cookie="username=kobe brankt; expires=Tue Aug 02 2022 16:34:17 GMT";

可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie作用于当前页面

document.cookie="username=tim ducn; path=/";

读取数据

var x = document.cookie

删除数据 只需要设置以前的时间即可

document.cookie="username=kobe brankt; expires=Tue Aug 02 2022 16:34:17 GMT";