HTML5 Web Storage

sessionStorage方法如果关闭了浏览器，这个保存的数据就丢失，在一次打开浏览器浏览这个页面的时候，点击读取数据将读取不到任何数据。

而localStorage则是浏览器被关闭，下次在打开浏览器浏览这个页面点击读取数据时任然能读取到保存的数据。当然，这个数据是区分浏览器的，在别的浏览器中是读取不到这个浏览器保存的数据的。

两种对象使用方法

1．sessionStorage

保存数据：sessionStorage.setItem(key,value);

读取数据：sessionStorage.getItem(key);

2．localStorage

保存数据：localStorage.setItem(key,value);

读取数据：localStorage.getItem(key);

看上面的说明相信大家都能很快明白两种对象的使用方法。但是，不管是使用哪个对象，都是用setItem(键名,键值)的方法来保存数据，保存后不允许修改键名，但是可以修改键值也就是说只新建键名，再保存键值。使用getItem方法读取数据时，将参数指定为键名，返回键值。

// sessionStorage示例JS

function savesessionStorage(id){

var target= document.getElementById(id);

var str=target.value;

sessionStorage.setItem("message",str);

}

function loadsessionStorage(id){

var target=document.getElementById(id);

var msg=sessionStorage.getItem("message");

target.innerHTML=msg;

}

// localStorage示例JS

function savelocalStorage(id){

var target= document.getElementById(id);

var str=target.value;

localStorage.setItem("message",str);

}

function loadlocalStorage(id){

var target=document.getElementById(id);

var msg=localStorage.getItem("message");

target.innerHTML=msg;

}