H5 的 sessionStorage和localStorage

1） H5 新增的 sessionStorage 和 localStorage 的區別

　　sessionStorage 和 java 的 session 差不多，可以短時間存儲信息，電腦瀏覽器常用sessionStorage 存儲用戶登錄信息（個人理解）

　　localStorage 可以永久保留用戶信息，不用每次都登錄，常用於APP

2）sessionStorage 和 localStorage 共有的方法：

　　1.setItem  存值

　　　　setItem就像是java里的map，但是有泛型<String,String>

　　　　sessionStorage.setItem("user",user);

　　2.getItem  取值

　　　　sessionStorage.getItem("user");

　　3.removeItem   刪除值

　　　　sessionStorage.removeItem("user");

　　4.clear  清除所有值

　　　　sessionStorage.clear();

3）前端轉換JSON和String

　　String轉成JSON　　JSON.parse();

　　JSON轉成String　　JSON.stringify();

以上就是H5新增的 sessionStorage 和 localStorage 的基本用法，結合實例會更明白他們的用法。

　　代碼如下：

　　　　　　//如果falg為真，也就是驗證碼正確，向後臺發請求
                if(flag==true){
                    $.post("http://localhost:8080/test/admin/login",{username:user,password:pwd},function (data) {
                        if(data){
                            //setItem就像是java里的map的put，但是有泛型<String,String>
                            //data是JSON類型的，所以用JSON.stringify(data)轉為String
                            var s=JSON.stringify(data);
                            sessionStorage.setItem("admin",s);
                            window.location.href="index.html";
                        }else{
                            flag=false;
                            //把驗證碼恢複原來的狀態
                            re.refresh();
                            $("#msg").html("<span style='color: red;'>用戶名或密碼錯誤，請重試！！！</span>");
                            setTimeout(function () {
                                $("#msg").html("");
                            },2000);
                        }
                    })
                }else{
                    $("#msg").html("<span style='color: red;'>請滑動驗證碼！！!</span>");
                    setTimeout(function () {
                        $("#msg").html("");
                    },2000);
                }

 2019-09-09 10:18:45