sessionStorage的舉例說明

時間 2019-11-19

原文原文鏈接

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>本地存儲sessionStorsge</title>
</head>
<body>
<input type="text" id="msg">
<input type="button" id="setData" value="保存數據">
<input type="button" id="getData" value="獲取數據">
<input type="button" id="removeData" value="清除數據">
<input type="button" id="clearData" value="所有清空">
<script>
    window.onload= function () {
        alert("當你關閉此頁面或者關閉瀏覽器的時候，sessionStorage中保存的數據纔會消失，也就是說從新打開此頁面的時候，點擊獲取數據  ，將不會顯示任何數據，刷新頁面無效。\r\n由此能夠證實，sessionStorage的生命週期爲，某個用戶瀏覽網站時，從進入到離開的這段時間。");
        var msg=document.getElementById('msg');
        var setData=document.getElementById('setData');
        var getData=document.getElementById('getData');
        var removeData=document.getElementById('removeData');
        var clearData=document.getElementById('clearData');
        setData.onclick= function () {//存入數據
            if(msg.value){
                sessionStorage.setItem('data',msg.value);
                alert('信息已保存中data字段中');
            }else {
                alert('信息不能爲空')
            }
        };
        getData.onclick= function () {//獲取數據
            var msg = sessionStorage.getItem('data');
            if(msg){
                alert('data字段中的值爲'+msg);
            }
            else {
                alert('data字段無值');
            }
        };
        removeData.onclick= function () {//清除部分選定的數據
            var msg = sessionStorage.getItem('data');
            if(msg){
                sessionStorage.removeItem('data');
            }else {
                alert('data字段中的數值爲空')
            }
        };
        clearData.onclick=function(){//清楚所有數據
            sessionStorage.clear();
        }
    }
</script>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。