html 5-データストレージ

1.Cookie
Cookieはhtmlストレージの最も基本的な方法であり、アクセス者コンピュータに格納される変数である.コンピュータファイルに文字列として格納されます.あるページを閲覧するたびに、このクッキーがサーバのバックグラウンドに送信されます.
Cookieにはサイズ制限があり、各cookieに格納されているデータは4 kbを超えてはいけません.cookie文字列の長さが4 kbを超えると、この属性は空の文字列を返します.
Cookieを使用する場合は有効期間を設定する必要があり、設定しないとブラウザを閉じるとcookieは消えてしまいます.
JSでCookiesを保存する:

　document.cookie  = 'username=Darren'

以上のコードの「username」はクッキー名を表し、「Darren」はこの名前に対応する値を表す.クッキー名が存在しないと仮定すると、新しいクッキーを作成します.存在する場合は、このクッキー名に対応する値を変更します.クッキーを複数回作成する場合は、この方法を繰り返し使用すればいいです.
Cookiesパッケージ関数(設定時間を含む):

 　function setCookie(c_name, value, expiredays){
2 　　　　var exdate=new Date();
3 　　　　exdate.setDate(exdate.getDate() + expiredays);
4 　　　　document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
5 　　}
6 　　    ：setCookie('username','Darren',30)  

クッキーの様々な制限のため、html 5種類には2つの新しいストレージ方式が現れ、より大きな情報を格納することができ、簡単に使用することができます.
2.sessionStorage
データをセッションオブジェクトに保存します.sessionとは,ユーザがあるサイトを閲覧する際に,サイトにアクセスしてからブラウザが閉じるまでの時間を指す.sessionは、この間に保存する必要があるデータを保存できます.ページが閉じると、データは消えます.
使用方法:
jsでsessionStorageを直接使用する.setItemメソッドは、保存するキー値のペアを設定し、取得時にキーで探せばよい.

/**
 *   sessionStorage
 * @param id
 */
function saveStorage(id){
    var target=document.getElementById(id);
    var value=target.value;
    sessionStorage.setItem("msg",value);
}
/**
 *   sessionSttorage
 * @param id
 */
function loadStorage(id){
    var target=document.getElementById(id);
    var value=sessionStorage.getItem("msg");
    target.innerHTML=value;
}

3.localStorage:
クライアントbendingのハードウェアデバイスにデータを保存し、ブラウザが閉じてもデータは保存されます(長期記憶)
使用方法はsessionStorageと同様で、sessionStorageメソッドをlocalStorageに置き換えるだけです.
 

/**
 *   localStorage
 * @param id
 */
function saveStorage(id){
    var target=document.getElementById(id);
    var value=target.value;
    localStorage.setItem("msg",value);
}
/**
 *   sessionSttorage
 * @param id
 */
function loadStorage(id){
    var target=document.getElementById(id);
    var value=localStorage.getItem("msg");
    target.innerHTML=value;
}

sessionStorageとlocalStorageの下位層はクッキーによって実現される.