zoukankan      html  css  js  c++  java
  • localstorage本地存储

       本文来自:http://2806814127.iteye.com/blog/2314656    

          本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存在本地的,除非清空本地的数据,后者只是伴随着session,窗口一旦关闭就没了。两者的用法完全一样。存储数据的方法就是直接给window.localStorage添加一个属性,例如:window.localStorage.a 或者 window.localStorage["a"]。它的读取、写、删除操作方法很简单,是以键值对的方式存在的,例如:

    Js代码  收藏代码
    1. localStorage.a = 1;//设置a为"3"  
    2. localStorage["a"] = "nihao";//a的新值会覆盖上面的值;  
    3. localStorage.setItem("b","hello");//设置b为"hello";  
    4. var a1 = localStorage["a"];//获取a的值  
    5. var a2 = localStorage.a;//获取a的值  
    6. var b = localStorage.getItem("b");//获取b的值  
    7. localStorage.removeItem("c");//清除c的值  

               最常使用的是getItem()和setItem()方法,清除键值对使用removeItem()。如果希望一次性清除所有的键值对,使用clear()。另外HTML5还提供了一个key()方法,可以在不知道有哪些键值的时候使用,如下:

    Js代码  收藏代码
    1. var storage = window.localStorage;  
    2. function showStorage(){  
    3.  for(var i=0;i<storage.length;i++){  
    4.    //key(i)获得相应的键,再用getItem()方法获得对应的值  
    5.    document.write(storage.key(i)+ " : " + storage.getItem(storage.key(i)) + "<br>");  
    6.     }  
    7.  }  
    8.      

              需要注意的是,HTML5本地存储只能存字符串,任何格式存储的时候都会被自动转为字符串,所以在存和读取的时候,需要自己进行类型的转换,目前javascript使用非常多的json格式,可以直接调用JSON.stringify()将其转为字符串。读取出来后调用JSON.parse()将字符串转为json格式,如下所示:

    Js代码  收藏代码
    1. //本地存取对象  
    2. var  cartInfo={classification: "饮料",name: "可口可乐", price: "3", unit: "瓶"};  
    3. localStorage.setItem("data",JSON.stringify(cartInfo)); //  往本地存 cartInfo这个对象  
    4. var cartInfo=JSON.parse(localStorage.getItem("data"));//从本地取出 cartInfo这个对象  
    5. //本地也可以存取元素为对象的数组,和上面的方法一样  
    6. var cartList =[  
    7.                {classification: "饮料",name: "可口可乐", price: "3", unit:“瓶”},  
    8.                {classification: "饮料",name: "雪碧", price : "3",   unit:“瓶”},  
    9.                {classification: "水果", name: "苹果", price : "5.5", unit: "斤"},  
    10.                {classification: "水果", name: "荔枝",  price: "15",   unit: "斤"},  
    11.                {classification: "生活用品",name: "电池", price : "2", unit:“个”},  
    12.                {classification: "食品", name: "方便面",  price: "4.5", unit: "袋"},  
    13.                ];  
    14.  localStorage.setItem("cartList",JSON.stringify(cartList)); //  往本地存cartList这个数组  
    15.  cartList=JSON.parse(localStorage.getItem("cartList"));  //从本地取出 cartList这个数组  
  • 相关阅读:
    20155206 2017-2018-1 《信息安全系统设计基础》第3周学习总结
    20155206 第三周随堂测试补交
    20155206 2017-2018-1 《信息安全系统设计基础》第1周学习总结
    20155206 实验五 网络编程与安全
    20155206 2016-2017-2《Java程序设计》课程总结
    20155206 《Java程序设计》实验四实验报告
    第十二周课堂练习
    J-5 Java语言基础
    C-2 方法重载,比较大小
    C-1 九九乘法表
  • 原文地址:https://www.cnblogs.com/mmzuo-798/p/7595006.html
Copyright © 2011-2022 走看看