zoukankan      html  css  js  c++  java
  • storage事件中的坑,storage.setItem()无法触发storage事件

    一、概述

    众所周知,以下代码可以用来监听页面中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);

    大家也可以自己测试一下,希望能帮到大家,谢谢^_^

      

    代码改变世界,我的《源代码》,我的世界!
  • 相关阅读:
    Codeforces Round #581 (Div. 2)
    Codeforces Round #605 (Div. 3)
    cin,cin.get(),cin.getline(),getline()
    容斥原理原理
    词法分析器
    Web学习开始。
    Convex hull凸包
    对max_flow做一个总结
    Vue中动画封装
    Vue中的动画特效
  • 原文地址:https://www.cnblogs.com/wshiqtb/p/14902468.html
Copyright © 2011-2022 走看看