web Storage理解

两种机制

• sessionStorage：为每一个给定的源（given origin）维持一个独立的存储区域，该存储区域在页面会话期间可用（即只要浏览器处于打开状态，包括页面重新加载和恢复。也就说当浏览器关闭的时候存储的信息就会消失，下次再打开的时候需要重新验证
• localStorage：功能和sessionStorage一样，但是不同的是关掉浏览器的时候信息不会被清除。
  但是这两个在浏览器刷新的时候都不会进行改变，只有在关闭的时候sessionStorage才会改变
  注意：现在有些浏览器还是不支持storage的所以我们使用之前可以先进行检测一下，是否支持

if (typeof(Storage) !== "undefined") {
  // Code for localStorage/sessionStorage.
} else {
  // Sorry! No Web Storage support..
}

localStorage的使用方法

// localestorage使用setItem来设置值，其中lastname为key值，smith为value值
localStorage.setItem("lastname", "Smith");

// 下面这个代码的意思表示，获取一个id为result的元素然后将localStorage刚才设置的value值插入进去，也就是说localStorage是根据getItem来获取当前key值对应的value值
document.getElementById("result").innerHTML = localStorage.getItem("lastname");

还有另外一种赋值的方式，这种采用.的方式直接进行赋值

// Store
localStorage.lastname = "Smith";
// Retrieve
document.getElementById("result").innerHTML = localStorage.lastname;

当我们想删除的时候，使用的是removeItem

localStorage.removeItem("lastname");