標籤:style blog color java io 資料 ar cti
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對應的值儲存到sessionStorage19 alert("資訊已儲存到data欄位中");20 }21 else22 {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 else35 {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>