• web 本地存储 (localStorage、sessionStorage)


    web 本地存储 (localStorage、sessionStorage,cookie)

    1. localStorage(长期储存):即使关闭浏览器数据也不会删除,除非使用localStorage.clear()去清掉数据。

    2. sessionStorage(临时存储):数据保存在当前浏览器中,浏览器关闭数据也随之消失。

    3. cookie:是一些数据, 存储于你电脑上的文本文件中。当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息。

    sessionStorage 和 localStorage 的用法基本一致,引用类型的值要转换成JSON

    1. 保存数据到本地

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

    2. 从本地存储获取数据

     getItem(“key”):获取名称为key的值,如果key不存在则返回null

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

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

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

    4. 删除所有保存的数据

    1 sessionStorage.clear();
    2 localStorage.clear();

    5. js下cookie使用方法

    可以为 cookie 添加一个过期时间(以 UTC 或 GMT 时间)。默认情况下,cookie 在浏览器关闭时删除。

    JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookie。

    创建cookie:

    1 document.cookie="name=tom";<br><br>可为cookie添加一个过期时间:<br>document.cookie="name=tom; expires=Thu, 26 Dec 2017 12:00:00 GMT";

    读取cookie:

    1 var co = document.cookie;  // 以字符串的方式返回所有的 cookie

    删除cookie:

    1 document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

    删除cookie只需要将expires的值设为当前时间之前就行了,删除是不必指定cookie的值。

    6. jq下cookie使用方法

    使用该方法,需要先引入jQuery文件与jQuery.cookie文件

    创建cookie:

    1 $.cookie('key','value')  //  注:当没有指明 cookie有效时间时,所创建的cookie有效期默认到用户关闭浏览器为止

    创建一个具有有效期的cookie:

    1 $.cookie('name', 'value', { expires: 10 });

    读取cookie:

    1 $.cookie('name')  // cookie存在,值为'value',不存在,则为null

    删除cookie:

    1 $.cookie('name',null)

    浏览器查看方法

    • 进入开发者工具
    • 选择 Application
    • 在左侧 Storage 下 查看 Local Storage 和 Session Storage

    2018-07-2117:57:27

  • 相关阅读:
    学Java需要了解的linux系统和unix系统
    51Nod 1649: 齐头并进(最短路)
    51Nod 1694: 两条路径(图论)
    The Preliminary Contest for ICPC Asia Shanghai 2019
    牛客练习赛52 A:数数(快速幂)
    The Preliminary Contest for ICPC Asia Shenyang 2019
    The 2019 Asia Nanchang First Round Online Programming Contest
    2019 年百度之星·程序设计大赛
    2019中国大学生程序设计竞赛(CCPC)
    2019 年百度之星·程序设计大赛
  • 原文地址:https://www.cnblogs.com/chailuG/p/9347464.html
Copyright © 2020-2023  润新知