web本地存储（localStorage、sessionStorage、cookie）

最新推荐文章于 2023-08-01 19:53:33 发布

臭臭鬼

最新推荐文章于 2023-08-01 19:53:33 发布

阅读量359

点赞数

分类专栏： js 文章标签：前端

本文链接：https://blog.csdn.net/qq_40630924/article/details/118794992

版权

js 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

web本地存储（localStorage、sessionStorage、cookie）

sessionStorage 和 localStorage 的用法基本一致，引用类型的值要转换成JSON
1.localStorage、sessionStorage的用法

保存数据到本地

	const info = {
      name: 'Lee',
      age: 20,
      id: '001'
    };
    sessionStorage.setItem('key', JSON.stringify(info));
    localStorage.setItem('key', JSON.stringify(info));

从本地存储获取数据

	var data1 = JSON.parse(sessionStorage.getItem('key'));
	var data2 = JSON.parse(localStorage.getItem('key'));

本地存储中删除某个保存的数据

	sessionStorage.removeItem('key');
	localStorage.removeItem('key');

删除所有保存的数据

	sessionStorage.clear();
    localStorage.clear();

2.cookie的用法

 	//存储cookie
    set (name, value, days) {
      var exp = new Date()
      exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000)
      document.cookie = name + '=' + encodeURI(value) + ';path=/;expires=' + exp.toGMTString()
    },
    //读取
    get (name) {
      var arr = document.cookie.match(new RegExp('(^| )' + name + '=([^;]*)(;|$)'))
      if (arr !== null) {
        return decodeURI(arr[2])
      } else {
        return null
      }
    },
    //删除
    del (name) {
      var exp = new Date()
      exp.setTime(exp.getTime() - 1)
      var cval = this.get(name)
      if (cval !== null) document.cookie = name + '=' + cval + ';path=/;expires=' + exp.toGMTString()
    },
    setbtn(){
      let val='我是存储到cookie里的数据'
      this.set('ssotoken', val, 3)
    },
    getbtn(){
      let ss = this.get('ssotoken')
      console.log(ss)
    },
    delbtn(){
      this.del('ssotoken')
    },