javaScript--6 sessionStorage与localStorage 设置与获取

 

 

 

 

<!DOCTYPE html>
<html>

<head>
  <title>本地存储</title>

  <script>
    function setSessionStorage() {
      //添加sessionStorage
      var name = document.getElementById("setSessionStorage").value;
      var value = document.getElementById("sessionStorageParam").value;
      window.sessionStorage.setItem(name, value);
    }

    function getSessionStorage() {
      //获取sessionStorage
      var name = document.getElementById("getSessionStorage").value;
      var value = window.sessionStorage.getItem(name);
      if (value != null) {
        document.getElementById("sessionStorageValue").innerText = value;
      } else {
        document.getElementById("sessionStorageValue").innerText = name + "暂无数据";
      }
    }

    function setlocalStorage() {
      //添加sessionStorage
      var name = document.getElementById("setlocalStorage").value;
      var value = document.getElementById("localStorageParam").value;
      window.localStorage.setItem(name, value);
    }

    function getlocalStorage() {
      //获取sessionStorage
      var name = document.getElementById("getlocalStorage").value;
      var value = window.localStorage.getItem(name);
      if (value != null) {
        document.getElementById("localStorageValue").innerText = value;
      } else {
        document.getElementById("localStorageValue").innerText = name + "暂无数据";
      }
    }
  </script>
</head>

<body>
  <h1>sessionStorage</h1>
  设置SessionStorage：<br />
  名称：<input type="text" id="setSessionStorage" /> 参数：<input type="text" id="sessionStorageParam" /> <input type="button"
    value="添加sessionStorage" onclick="setSessionStorage()" /><br />

  获取SessionStorage：<br />
  名称：<input type="text" id="getSessionStorage" /><span id="sessionStorageValue"></span>
  <br />
  <input type="button" value="获取sessionStorage" onclick="getSessionStorage()" />

  <h1>localStorage</h1>
  设置localStorage：<br />
  名称：<input type="text" id="setlocalStorage" /> 参数：<input type="text" id="localStorageParam" /> <input type="button"
    value="添加localStorage" onclick="setlocalStorage()" /><br />

  获取localStorage：<br />
  名称：<input type="text" id="getlocalStorage" /><span id="localStorageValue"></span>
  <br />
  <input type="button" value="获取localStorage" onclick="getlocalStorage()" />
</body>

</html>

 

posted @ 2022-10-03 15:10  怪圣卡杰  阅读(449)  评论(0)  编辑  收藏  举报