zoukankan      html  css  js  c++  java
  • sessionStorage 与 localStorage 重新认识?

      之前写过一次关于 js存储的总结,但是今天在项目中遇到一个bug让我重新在认识 sessionStorage 与 localStorage。以下的介绍都是基于同源下进行的,仔细看下面的案例:

    a.html

    <script>
        function add() {
          window.sessionStorage.setItem("test", "a页面的数据")
          // window.localStorage.setItem("test", "a页面的数据")
        }
      </script>
      <button onclick="add()">存储数据</button>
    
      <a href="b.html" target="_blank">前往b页面</a>
      <!-- <a href="b.html">前往b页面</a> -->
    

    b.html

    <a href="a.html">前往a页面</a>
      <script>
        function remove() {
          window.sessionStorage.removeItem("test");
          // window.localStorage.removeItem("test");
        }
      </script>
      <button onclick="remove()">清除</button>
    

      

    《1》先看 sessionStorage 情况

        a.页面跳转打开新窗口情况下

              

       b.页面跳转在当前窗口内

      

      通过上面的案例看出:

        通过带target="_blank"的a标签、window.open、location.href等方式打开新窗口时,会把旧窗口(或标签)的sessionStorage数据带过去,但从此之后,新窗口(或标签)的sessionStorage的增删改和旧窗口已经没有关系了。如果只是在当前窗口内跳转新页面(或者刷新),数据之间还是存在关系的。

    《2》先看 localStorage 情况

      a.页面跳转打开新窗口情况下

      

       b.页面跳转在当前窗口内

      

      通过上面的案例看出:

        不管是通过带target="_blank"的a标签、window.open、location.href等方式打开新窗口,还只是在当前窗口内跳转新页面(或者刷新),localStorage存储数据之间还是存在关系的 

          

      从上面的案例 所以在处理sessionStorage时,只要打开新窗口就要特别注意了,新旧窗口数据不会互相同步。

     

  • 相关阅读:
    思蕊防静电地板
    一个老站长的22条军规
    百度天天快照知识宝典
    搜索引擎常用搜索技巧
    网站运营工作流程
    关于线程间通信
    VS2012 EF5 连接oracle11.2
    ArcSde for Oracle服务注册
    NHibernate composite-id联合主键配置
    NHibernate 的 ID 标识选择器
  • 原文地址:https://www.cnblogs.com/changxue/p/11176430.html
Copyright © 2011-2022 走看看