浏览器 Web Storage - sessionStorage & localStorage
storage事件
当储存的数据发生变化时,会触发storage事件。我们可以指定这个事件的回调函数。
window.addEventListener("storage",onStorageChange);
function onStorageChange(e) {
console.log(e.key); //还有e.oldValue,e.newValue,e.url属性
}
值得特别注意的是,该事件不在导致数据变化的当前页面触发。如果浏览器同时打开一个域名下面的多个页面,当其中的一个页面改变sessionStorage或localStorage的数据时,其他所有页面的storage事件会被触发,而原始页面并不触发storage事件。可以通过这种机制,实现多个窗口之间的通信。所有浏览器之中,只有IE浏览器除外,它会在所有页面触发storage事件。
参考
Web Storage:浏览器端数据存储机制,阮一峰 http://javascript.ruanyifeng.com/bom/webstorage.html
浏览器 Web Storage - sessionStorage & localStorage的更多相关文章
- HTML5中的Web Storage(sessionStorage||localStorage)理解与简单实例
Web Storage是什么? Web Storage功能,顾名思义,就是在Web上针对client本地储存数据的功能,详细来说Web Storage分为两种: sessionStorage: 将数据 ...
- html5 Web Storage(localStorage(),sessionStorage())
Web Storage包括了两种存储方式:sessionStorage和localStorage sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束 ...
- H5的storage(sessionstorage&localStorage)简单存储删除
众所周知,H5的storage有sessionstorage&localStorage,其中他们的共同特点是API相同 下面直接上代码,storage中的存储与删除: <!DOCTYPE ...
- HTML5存储 ——Web Storage(localStorage 和 sessionStorage)
一.localStorage对象临时储存API 方法: 1.localStorage.setItem(key,value)---设置存储内容 2.localStorage.getItem(key)-- ...
- web storage: sessionStorage 和 localStorage
// sessionStorage.setItem("message",str);function saveStorage(id){ var target = document.g ...
- Vue.js Client-Side Storage;( Web Storage/localStorage)
原文:https://cn.vuejs.org/v2/cookbook/client-side-storage.html LocalStorage (api) my code pen :https:/ ...
- web storage和cookie的区别
Web Storage的概念和cookie相似,区别是它是为了更大容量存储设计的.Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外co ...
- 数据存储之Cookie和Web Storage。
Cookie Cookie,有时也用其复数形式Cookies,指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).接下来就谈谈cookie的一些利弊,coo ...
- HTML5之WEB Storage
什么是HTML5 web storage? 使用HTML5,web页面能够使用用户的浏览器本地保存数据. 在曾经,通常我们使用cookie来保存用户数据.然而使用web存储更加安全和高速.数据不再包括 ...
随机推荐
- cube-ui 重构饿了吗Webapp的 scroll-nav域名插槽问题
Vue2.6 将 slot-scope 废弃了. 推荐使用 v-slot: 其使用方法大致如下: 注意多个插槽的情况下,最好都基于 <template> default插槽用法还是一样的, ...
- mysql8.0 grant 创建账号及权限记录
针对 42000错误 原文:https://stackoverflow.com/questions/50177216/how-to-grant-all-privileges-to-root-user- ...
- 创建企业级地理数据库报错:ORA-01455
环境: Oracle Server : 11.2.0.3 (x64) Oracle Client : 11.1.0.6 (x32) Arcgis Desktop : 10.3 在该环境下执行 &qu ...
- strace调试工具编译移植
源码下载:https://github.com/strace/strace/releases/tag/v4.18(使用的较老版本,最新版 5.4 编译时依赖较多,最终博主放弃使用) [ 编译步骤 ] ...
- 【记录】【MySQL】拼接字符串函数 CONCAT(str1,str2)
CONCAT(str1,str2) 就是把str1和str2拼接
- 在ensp上配置RIPv2的认证
原理 实验模拟 实验拓扑 测试连通性 搭建rip网络 查看路由表 R3模拟攻击首先把在自己的的ip通告网段 配置完成后查看一下路由表 可以看到已经非法获取R1R2的网段信息,那么现在我们R3可以向两个 ...
- BJFU—214基于链式存储结构的图书信息表的创建和输出
#include<stdio.h>#include<stdlib.h>#define MAX 100 typedef struct bNode{ double no; char ...
- golang(一)
开篇先来个Go语言的吉祥物-金花鼠Gordon. golang是谷歌2009年发布的开源编程语言,截止目前go的release版本已经到了1.10.go语言的开发人员都是计算机界大神一般的存在: Th ...
- Gin上传文件到MongoDB gridfs
目录 上传图片 下载图片 上传图片 func imagePost(c *gin.Context) { image, err := c.FormFile("file") if err ...
- 【Linux】Ubuntu修改root用户密码
使用vmware安装ubuntu的时候,安装完之后发现没有root用户密码,只有新建用户,这个时候需要重新设置root用户密码 在新建用户下面运行 sudo passwd root