localStorage と sessionStorage は総称して Web Storage と呼ばれ、Web ページがブラウザー側にデータを保存できるようにします。
sessionStorage によって保存されたデータは、セッションが終了すると (通常はウィンドウが閉じられる)、次回 Web サイトにアクセスしたときに消去されます。 Web ページでは、以前の保存データを直接読み取ることができます。保存期間の違いを除けば、これら 2 つの オブジェクト の プロパティとメソッド はまったく同じです。
それらは cookie メカニズムの拡張バージョンに非常によく似ており、より大きなストレージスペースを使用できます。現在、ドメインごとのストレージ制限はブラウザによって異なり、Chrome では 2.5 MB、Firefox と Opera では 5 MB、IE では 10 MB です。このうち、Firefox のストレージ容量は第 1 レベルのドメイン名によって決まりますが、他のブラウザにはこの制限がありません。つまり、Firefox では、a.example.com と b.example が 5MB の記憶域を共有します。さらに、Cookie と同様に、同じドメイン制限の対象となります。 Web ページに保存されたデータは、同じドメイン内の Web ページでのみ読み取ることができます。
window オブジェクト に sessionStorage プロパティと localStorage プロパティが含まれているかどうかを確認することで、ブラウザがこれら 2 つのオブジェクトをサポートしているかどうかを判断できます。
function checkStorageSupport() { var result = {}; //sessionStorage if (window.sessionStorage) { result.sessionStorage = true; } else { result.sessionStorage = false; } //localStorage if (window.localStorage) { result.localStorage = true; } else { result.localStorage = false; } return result; }
sessionStorage.setItem('key', 'value'); localStorage.setTime('key', 'value');
var valueSession = sessionStorage.getItem('key');var valueLocal = localStorage.getItem('key');
sessionStorage.removeItem('key'); localStorage.removeItem('key');
clearメソッドは、保存されているデータをすべてクリアするために使用されます。
sessionStorage.clear(); localStorage.clear();
for (var i = 0; i < localStorage.length; i++) { console.log(localStorage.key(i)); }
localStorage.key(1);
コールバック関数を指定できます。
window.addEventListener('storage', onStorageChange);
function onStorageChange(e) { console.log(e.key); }
以上がHTML5ローカルストレージのlocalStorageとsessionStorageの具体的な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。