美文网首页
localStorage本地缓存

localStorage本地缓存

作者: _Railgun | 来源:发表于2017-08-16 09:22 被阅读0次

清空localStorage (clear)

localStorage.clear();//清空本地缓存

存储数据 (setItem)

localStorage.setItem('key',value);
//或者是localStorage.key=value;  value类型必须是字符串类型!
localStorage //Storage {key: value, length: 1}

读取数据 (getItem)

localStorage.getItem('key');//根据参数key取得本地缓存中对应的值
localStorage.valueOf()//读取所有数据
localStorage.key(0) //读取第一条数据(key-value)

删除某个变量 (removeItem)

localStorage.removeItem('key');//删除key所对应的那一条本地缓存

是否存在某个变量 (hasOwnProperty)

localStorage.hasOwnProperty('age'); // 判断当前LocalStorage是否有"age"这条记录(不包括原型属性)
//hasOwnProperty() 只能判断属性是否存在实例对象中不能判断是否存在原型对象中

将JSON存储在localStorage

localStorage中只能存储字符串,所以我们经常会用到
JSON.stringify(Object)将一个对象转换为字符串
再使用JSON.parse(ObjString)将一个字符串转换为对象

let hero ={
    Assassin:{
        name:"劫",
        age:22
    },
    Master:{
        name:"光辉",
        age:18
    }
}
//将JSON存储在localStorage步骤
//首先要将JSON转化为字符串到一个变量  (JSON.stringify())
//将这个变量存储在localStorage上
//最后获取的时候再转化为JSON  (JSON.parse())

hero = JSON.stringify(hero);        //将hero转化成字符串
localStorage.setItem("hero",hero);//localStorage只能存储字符串hero必须是字符串类型
let newHero = localStorage.getItem('hero');//获取hero内容
newHero = JSON.parse(hero);//将hero转化为JSON命名为新的变量newHero

window.onbeforeunload

当窗口关闭的时候发生的事件

window.onbeforeunload = function(){
// 高版本需要按F5刷新一下
    return "拜拜~";
}

相关文章

  • localStorage本地缓存

    清空localStorage (clear) 存储数据 (setItem) 读取数据 (getItem) 删除某个...

  • 缓存

    本地缓存 localStorage 大小:5M 永久性存储session会话缓存 session...

  • Java Script 本地缓存

    本地缓存(数据存放到浏览器) 1、cookie 2、localStorage(永久缓存) (1)localStor...

  • 关于本地存储

    1、html5几种存储形式本地存储(localStorage && sessionStorage)离线缓存(app...

  • 前端优化

    前端优化 缓存 本地数据存储 本地存储分为cookie(兼容性好)、localStorage(存在时间久、存储空间...

  • 2019-08-25WKWebView踩坑1.0

    实现JS读取iOS本地写入的LocalStorage 判断清除缓存 配置webView 设置 WKProcessP...

  • java-单例模式实现本地缓存

    几种方案: 1、分布式缓存中间件2、前端使用 localstorage 设置浏览器缓存3、本地缓存 优缺点 1、引...

  • 浏览器缓存方法 localStorage

    设置缓存 localStorage.setItem(key, value) 获取缓存 localStorage.g...

  • Web存储技术sessionStorage和localStora

    Web技术提供了sessionStorage(会话存储)和localStorage(本地缓存)两个存储对象来对网页...

  • localStorage缓存

    本地缓存Storage localStorage及sessionStorage使用(没有过期时间,不清空就一直在)...

网友评论

      本文标题:localStorage本地缓存

      本文链接:https://www.haomeiwen.com/subject/qrgbrxtx.html