sessionStorage的用法總結


sessionStorage用於本地存儲一個會話(session)中的數據,這些數據只有在同一個會話中的頁面才能訪問並且當會話結束后數據也隨之銷毀。因此sessionStorage不是一種持久化的本地存儲,僅僅是會話級別的存儲。下面是其用法:

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4   <meta charset="utf-8">
 5   <title>SessionStorage</title>
 6 <script type="text/javascript">
 7     window.onload = function()
 8     {
 9         //首先獲得body中的3個input元素
10         var msg = document.getElementById("msg");//文本框要輸入的內容
11         var getData = document.getElementById("getData");//獲取數據
12         var setData = document.getElementById("setData");//保存數據
13         var removeData=document.getElementById("removeData");//移除數據
14         setData.onclick = function()//存入數據
15         {
16             if(msg.value)
17             {
18                     sessionStorage.setItem("data", msg.value);//把data對應的值保存到sessionStorage
19                     alert("信息已保存到data字段中");
20             }
21             else
22             {
23                     alert("信息不能為空");
24             }
25         }
26         
27         getData.onclick = function()//獲取數據
28         {
29             var msg = sessionStorage.getItem("data");
30             if(msg)
31             {
32                     alert("data字段中的值為:" + msg);//把data對應的值彈出來
33             }
34             else
35             {
36                     alert("data字段無值!");
37             }
38         }
39         removeData.onclick=function() //移除數據
40         {
41             var msg = sessionStorage.getItem("data");
42             sessionStorage.removeChild(msg);
43         }
44     }
45 </script>
46 </head>
47 <body>
48     <input id="msg" type="text"/>
49     <input id="setData" type="button" value="保存數據"/>
50     <input id="getData" type="button" value="獲取數據"/>
51     <input id="removeData" type="button" value="移除數據"/>
52 </body>
53 </html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM