zoukankan      html  css  js  c++  java
  • JS本地保存数据的几种方法

    1.Cookie 
    这个恐怕是最常见也是用得最多的技术了,也是比较古老的技术了。COOKIE优点很多,使用起来很方便 
    但它的缺点也很多: 
    比如跨域访问问题;无法保存太大的数据(最大仅为4KB);本地保存的数据会发送给服务器,浪费带宽 等等;

    2.使用sessionStorage、localStorage 
    localStorage: 
    是一种你不主动清除它,它会一直将存储数据存储在客户端的存储方式,即使你关闭了客户端(浏览器),属于本地持久层储存 

    sessionStorage: 
    用于本地存储一个会话(session)中的数据,一旦会话关闭,那么数据会消失,比如刷新。 
    有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有: 
    1 缓存数据 
    2 减少对内存的占用 
    但是,storage只能存储字符串的数据,对于JS中常用的数组或对象却不能直接存储。 
    它能保存更大的数据(IE8上是10MB,Chrome是5MB),同时保存的数据不会再发送给服务器,避免带宽浪费。

    localStorage存储方法(sessionStorage类似) 
    localStorage.name =’vanida; 
    localStorage[“name”]=’vanida’; 
    localStorage.setItem(“name”,”vanida”); 
    //这三种设置值方式是一样的; 
    localStorage获取值方法 
    var name = localStorage[“name”] 
    var name= localStorage.name 
    var name= localStorage.getItem(“name”); 
    //这三种获取值方式是一样的; 
    localStorage清除特定值方法 
    //清除name的值 
    localStorage.removeItem(“name”); 
    localStorage.name=”; 
    localStorage清除所有值方法 
    localStorage.clear() 
    localStorage只能存储字符串,如果需要存储对象,首先要转化为字符串。利用JSON.stringify(); 
    var person = {name:”vanida”,”sex”:”girl”,”age”:25}; 
    localStorage.setItem(“person”,JSON.stringify(person)); 
    // localStorage.person=”{“name”:”vanida”,”sex”:”girl”,”age”:25}” 
    注意:JSON.stringify()中不要忘了“i”,stringify而不是stringfy! 
    然后取出person的对象你可以用JSON.parse(); 
    person = JSON.parse(localStorage.getItem(“person”));

  • 相关阅读:
    前端自动化gulp使用方法
    npm 如何提升最新版本
    AJAX——理解XMLHttpRequest对象
    免插件,简单实现上拉加载loading
    mobiscroll实现二级联动菜单
    js点击页面其他地方如何隐藏div元素菜单
    gulp自动化构建工具使用总结
    如何优雅的选择字体(fontfamily)
    js如何判断用户使用的设备类型及平台
    ant 软件包 javax.servlet.http 不存在 解决办法
  • 原文地址:https://www.cnblogs.com/wuweb/p/7846752.html
Copyright © 2011-2022 走看看