21.js中localStroage、sessionStroage、cookie

浏览器常见的本地存储

storage

        —localStorage

        —sessionStorage

cookie

localStorage和sessionStorage的异同

1.localStorage可以跨标签页操做，sessionStroage只能在同标签页

2.localStorage永久存储，sessIonStorage默认会话级别，浏览器关闭就消失

同：

        都只能储存基本数据类型，存储之后返回值是字符串类型

cookie和storage的区别

1.cookie是由js创建，前后端都能操作，storage由h5创建，只有前端能操作

2.cookie存储大小20MB，storage存储大小4KB

3.cookie可以设置过期时间，storage不能手动设置

localStorage使用

        增加/修改：window.localStorage.setItem(key,value)

        查询:window.localStorage.getItem(key)

                查到以字符串形式返回，没有则返回null

        删除：window.localStorage.removeItem(key)

                有key返回空白，若key不存在则返回undefined

        清空:window.localStorage.clear()

sessionStorage使用

    增加/修改：window.sessionStorage.setItem(key,value)

        查询:window.sessionStorage.getItem(key)

                查到以字符串形式返回，没有则返回null

        删除：window.sessionStorage.removeItem(key)

                有key返回空白，若key不存在则返回undefined

        清空:window.sessionStorage.clear()

cookie使用

        设置：document.cookie='key=value'

        获取：document.cookie

                   返回完整的cookie字符串'key=value;key2=value2'

                    没有就返回 {'' ":"undefined"}

        设置过期时间：

                document.cookie='key=value;expires=时间对象'

                要设置中国时区的过期时间要向后调整8个小时

var time = new Date();
  time.setTime(
     time.getTime() + expires * 1000 - 8 * 60 * 60 * 1000
  );
document.cookie = `${key}=${value}; expires=${time}`;