美文网首页
存储localStorage以及cookie

存储localStorage以及cookie

作者: 头头_d92d | 来源:发表于2019-04-28 14:11 被阅读0次

localStorage

解决了cookie存储空间不足的问题,localStorage中一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同,类型只能是字符串。
1.存储

//写入a字段
storage["a"]=1;
//写入b字段
storage.a=1;
//写入c字段
storage.setItem("c",3);

2.读取

//第一种方法读取
var a=storage.a;
console.log(a);
  //第二种方法读取
var b=storage["b"];
console.log(b);
//第三种方法读取
 var c=storage.getItem("c");
console.log(c);

3.删除

//单个清除
storage.removeItem("a");
//全部清除
storage.clear();

cookie

cookie是一个个键值对(“键=值”的形式)加上分号空格隔开组合而成,大小为4kb
1.设置cookie

/**
     * 设置cookie
     * @param name cookie的名称
     * @param value cookie的值
     * @param day cookie的过期时间
     */
    var setCookie = function (name, value, day) {
      if(day !== 0){     //当设置的时间等于0时,不设置expires属性,cookie在浏览器关闭后删除
        var expires = day * 24 * 60 * 60 * 1000;
        var date = new Date(+new Date()+expires);
        document.cookie = name + "=" + escape(value) + ";expires=" + date.toUTCString();
      }else{
        document.cookie = name + "=" + escape(value);
      }
    };
//使用
setCookie(a,3,12)

2.读取

/**
     * 获取对应名称的cookie
     * @param name cookie的名称
     * @returns {null} 不存在时,返回null
     */
    var getCookie = function (name) {
      var arr;
      var reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
      if (arr = document.cookie.match(reg))
        return unescape(arr[2]);
      else
        return null;
    };
//使用
getCookie(a)

3.删除

/**
     * 删除cookie
     * @param name cookie的名称
     */
    var delCookie = function (name) {
      setCookie(name, ' ', -1);
    };

相关文章

  • 本地存储

    本地存储分为cookie,以及新增的localStorage和sessionStorage 1、cookie 存储...

  • 本地储存与jQueryui

    本地存储分为cookie,以及新增的localStorage和sessionStorage 1、cookie 存储...

  • jquery本地存储和jqueryUI

    本地存储分为cookie,以及新增的localStorage和sessionStorage 1、cookie 存储...

  • 本地存储

    本地存储分为cookie,以及新增的localStorage和sessionStorage 1、cookie 存储...

  • 本地存储

    本地存储分为cookie,以及新增的localStorage和sessionStorage cookie 存储在本...

  • 本地存储和jQuery UI

    本地存储 本地存储分为cookie,以及新增的localStorage和sessionStoragecookie ...

  • 2018-12-12本地存储

    * 本地存储 * 本地存储分为cookie,以及新增的localStorage和sessionStorag...

  • Charry

    一、本地存储: 本地存储分为cookie,以及新增的localStorage和sessionStorage 区别:...

  • 本地存储、表单验证、let|const|var区别、进程|线程|

    一、本地存储: 本地存储分为cookie,以及新增的localStorage和sessionStorage 区别:...

  • 3月 前端 19 Day

    本地存储本地存储分为cookie,以及H5新增的 localStorage 和 sessionStorage ;...

网友评论

      本文标题:存储localStorage以及cookie

      本文链接:https://www.haomeiwen.com/subject/kvkdnqtx.html