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>