一、概述
众所周知,以下代码可以用来监听页面中localstorage和sessionstorage中属性值的变化
window.addEventListener(‘storage‘, event=>{})
二、预期
假如我们打开一个页面a.html,内有如下代码
window.addEventListener(‘storage‘, e=>{console.log(e)})
我们在当前标签页控制台输入如下代码
localStorage.setItem(‘test‘, 111); localStorage.setItem(‘test‘, 222)
你会发现,控制台并不会执行storage事件,这是为什么呢?
三、查阅资料
MDN文档,上有一段描述可能很多人并不会在意,原来storage事件,只有在其它标签页改变storage属性值,才会执行。
四、测试
浏览器打开两个页面a.html标签,在第二个标签执行如下代码,第一个标签的storage监听事件会被执行,当在第一个标签页执行如下代码,第二个标签页的storage监听事件会被执行
localStorage.setItem(‘test‘, 111);
大家也可以自己测试一下,希望能帮到大家,谢谢^_^