• html5 Web Storage(localStorage(),sessionStorage())


    Web Storage包括了两种存储方式:sessionStorage和localStorage

    sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。

    localStorage 是持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

    Web Storage与cookie异同

    1. cookie 支持的数据内容小,8k左右。localStorage目前能支持到10M
    2. 每次请求一个新的页面的时候Cookie都会被发送过去,浪费了带宽
    3. cookie 需要指定作用域,不可以跨域调用
    4. Web Storage 拥有setItem,getItem,removeItem,clear等方法,cookie 需要前端开发者自己封装setCookie,getCookie方法。

    localStorage浏览器支持情况

     1 <script type="text/javascript">
     2 // method one
     3 if(window.localStorage){
     4     alert("浏览支持localStorage")
     5 }else{
     6     alert("浏览暂不支持localStorage")
     7 }
     8 // method two
     9 if(typeof window.localStorage == 'undefined') {
    10     alert("浏览暂不支持localStorage")
    11 }
    12 </script>

    localStorage和sessionStorage操作

    • localStorage.setItem(key,value)    // 设置键值对
    • localStorage.getItem(key)      // 通过键值读取对应的值
    • localStorage.removeItem(key)    // 通过键值移除对应的值
    • localStorage.clear()        // 初始化localStorage,清除所有键值对
    • localStorage.key(index)     // 通过下标index来获取指定索引的key名

    其他操作方法:点操作和[ ]

    1 <script type="text/javascript">
    2     var storage = window.localStorage;
    3     storage.key1 = "hello";
    4     storage["key2"] = "world";
    5     console.log(storage.key1);
    6     console.log(storage["key2"]);
    7 </script>

    相关:IE专属存储 UserData.

  • 相关阅读:
    APIO2015雅加达的摩天楼
    索引(填坑进度:0.1‰)
    树形 DP 笔记 · 一
    「已弃坑」DP 优化的各种姿势 (From CF)
    C++ 的位运算:__builtin, bitset
    LA 7158. ACM-ICPC World Finals 2015 I. Ship Traffic
    LA 7155. ACM-ICPC World Finals 2015 F. Keyboarding
    LA 7150. ACM-ICPC World Finals 2015 A. Amalgamated Artichokes
    LA 7587. ACM-ICPC World Finals 2016 L. Swap Space
    LA 7578. ACM-ICPC World Finals 2016 C. Ceiling Function
  • 原文地址:https://www.cnblogs.com/hzj680539/p/5061961.html
Copyright © 2020-2023  润新知