zoukankan      html  css  js  c++  java
  • Web Storage详解

    1、概述:

    对于Web Storage来说,实际上是Cookies存储的进化版。如果了解Cookie的人几乎一看Web Storage就会用,如果你从来没用过没了解过Cookie,没关系,看了这篇文章照样轻松玩转Web Storage。首先,学习Web Storage只需背熟这句口诀:两个接口,四个函数

    2、口诀:

    1)两个接口:分别是localStoragesessonStorage

    2)四个函数:分别是setItemgetItemremoveItemclear

    3localStorage

    1)特性:

         域内安全、永久保存。即客户端或浏览器中来自同一域名的所有页面都可访问localStorage数据且数据除了删除否则永久保存,但客户端或浏览器之间的数据相互独立。

    2)四个函数:

         A. localStorage.setItem      存储数据信息到本地

         B. localStorage.getItem      读取本地存储的信息

         C. localStorage.removeItem   删除本地存储的信息

         D. localStorage.clear        清空所以存储的信息

    4sessonStorage

     1)特性:

          会话控制、短期保存。会话概念与服务器端的session概念相似,短期保存指窗口或浏览器或客户端关闭后自动消除数据。

     2)四个函数:

          A. sessionStorage.setItem       存储数据信息到本地

          B. sessionStorage.getItem       读取本地存储的信息

          C. sessionStorage.removeItem    删除本地存储的信息

          D. sessionStorage.clear         清空所以存储的信息

    5、四个函数的用法:

    1localStorage.setItem(键名,键值)

             在本地客户端存储一个字符串类型的数据,其中,第一个参数键名代表了该数据的标识符,而第二个参数键值为该数据本身。如:

                     localStorage.setItem("coffeeType", "mocha");      //存储键名为coffeeType和键值为mocha的数据到本地
                     localStorage.setItem("coffeePrice", "28");        //有了上一句做参考,这句意思你该理解了吧

    2localStorage.getItem(键名)

             读取已存储在本地的数据,通过键名作为参数读取出对应键名的数据。如:

                     var data = localStorage.getItem("coffeeType");   //读取对应键名为coffeeType的数据

         
    3localStorage.removeItem(键名)

             移除已存储在本地的数据,通过键名作为参数删除对应键名的数据。如:

                     localStorage.removeItem("coffeeType");           //从本地存储中移除键名为coffeeType的数据
         
    4localStorage.clear()

             移除本地存储所有数据。如:

                     localStorage.clear();      //保存着的"coffeePrice/28"/值对也被移除了,所有本地数据拜拜


    5)另外,sessionStorage中的四个函数与以上localStorage类的函数用法基本一致,就不再详解

    6、兼容问题:

    有人会说本地存储是H5的新贵,但是对于老、旧的浏览器来说怎么办?那就不用老古董浏览器呗,或者使用cookie作为替代。因为大多使用localStorage是用来存储字符串的,在其他编译型的语言看来,存储字符串能做些什么,但在javascript身上,旧大放光彩,可以存储JSON格式的字符串来扩展应用,可以存储类名变量值等等信息再通过eval()来感受使用JS的快感。既然localStorage是存储字符串的,那么在老古董浏览器上,可以通过使用Cookies来做替代方案并做好域内安全。

  • 相关阅读:
    (转)Silverlight 与 JS交互
    使用wcf服务捕捉到“POST http://yourIP/WCFService.svc 405 (Method Not Allowed) ”错误!
    Silverlight 页面传值问题(转)
    (转)发布Silverlight+WCF程序到IIS后,客户端访问数据库失败的解决方案
    Static Function Test
    .net 开发者尝试Apache Spark™
    Ubuntu 16.04.2 LTS 安装 jdk1.6 和 tomcat6 (一)
    Ubuntu 16.04.2 LTS 安装 jdk1.6 和 tomcat6 (二)
    Win10+VS2015折腾小记
    经验不是万能的----驴子驮盐
  • 原文地址:https://www.cnblogs.com/D-Y-W/p/6985002.html
Copyright © 2011-2022 走看看