浅谈localStorage和sessionStorage

localStorage

html5本地存储

            优点

                1、没有时间限制

                2、大小5M

                3、没有域的限制

                4、只能存储字符串

属于window

 

设置

        localStorage.setItem("key","value");

        //第一种

        localStorage.name = "宋磊";

        //第二种

        localStorage["age"] = 33;

        //第三种

        localStorage.setItem("sex","男");

 

获取

        console.log(localStorage.name)

        console.log(localStorage["age"])

        console.log(localStorage.getItem("sex"))

 

// 遍历获取

for(var i=0;i<localStorage.length;i++){

    var key=localStorage.key(i);

    console.log(key);                              //打印出所有的键

    console.log(localStorage[key]);        //打印出所有的value值

}

 

 

删除

 localStorage.removeItem("name");

删除所有

localStorage.clear();

 

 

sessionStorage

 

   设置

  sessionStorage.setItem("key","value");

        //第一种

        sessionStorage.name = "宋磊";

        //第二种

        sessionStorage["age"] = 33;

        //第三种

        sessionStorage.setItem("sex","男");

    获取

        console.log(sessionStorage.name)

        console.log(sessionStorage["age"])

        console.log(sessionStorage.getItem("sex"))

    遍历获取 sessionStorage 所有的数据

    for(var i=0;i<sessionStorage.length;i++){

        var key = sessionStorage.key(i);

        console.log(sessionStorage[key])

    }

    

    删除

    sessionStorage.removeItem("name");

    //删除所有

    sessionStorage.clear();

 

 

 

localStorage   sessionStorage   cookie  session  四者的区别

 

 1、大小5M 没有时间限制 没有域的限制

 2、大小5M 关闭浏览器之后立马销毁 没有域的限制 临时会话 只要关闭浏览器数据就会立马消失

 3、绘话跟踪技术 主要是用来验证身份信息 一般不会去做存储

       前三者 存储在前端

 4、存储在后端的 通过后端设置时间来决定当前用户的账户和密码保存的时间一般情况下来做持久登录