web存儲

時間 2019-12-06

標籤 web 存儲欄目 HTML 简体版

原文原文鏈接

1、存儲遵循同源原則

2、幾種形式

1. web存儲API

1）本地存儲：localstorage對象

<body>
<input id="ipu"/>
<button id="btn">存儲</button>
<script>
    var btn = document.getElementById('btn');
    var str = document.getElementById('ipu');
    if(localStorage.myKey != undefined){
        str.value = localStorage.myKey;
    }
    btn.onclick = function () {
        localStorage.myKey = str.value;
    };
</script>
</body>

A. localstorage對象存儲的數據有效期爲永遠！永不過時。javascript

B. 遵循同源策略java

C. 受瀏覽器供應商限制，不一樣的瀏覽器不能相互訪問相同頁面的localstorage！web

2）會話存儲：sessionStorage對象

<body>
<input id="ipu"/>
<button id="btn">存儲</button>
<script>
    var btn = document.getElementById('btn');
    var str = document.getElementById('ipu');
    if(sessionStorage.myKey2 != undefined){
        //這段在從新打開一個頁面窗口的時候實際上是不起效的
        //但在同一窗口不關閉的狀況下刷新能起做用！
        str.value = sessionStorage.myKey2;
    }
    btn.onclick = function () {
        sessionStorage.myKey2 = str.value;
    };
</script>
</body>

A. sessionStorage存儲的數據隨窗口的聲明週期。一旦窗口或者標籤被永遠關閉了，那麼全部經過sessionstorage存儲的數據也會都被刪除！瀏覽器

B. 遵循同源策略服務器

C. 受瀏覽器供應商限制，不一樣的瀏覽器不能相互訪問相同頁面的sessionStorage！cookie