HTML5提供了两种在客户端存储数据的新方法：
-
localStorage - 没用时间限制的数据存储，一年以后数据仍然可以使用
-
sessionStorage -针对一个session的数据存储之前，这些都是由cookie完成的。但是cooki不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得cookie速度很慢而且效率也不高
下面来看localStorage:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var ta;
var btn;
window.onload = function(){
ta = document.getElementById("ta");
if(localStorage.text){
ta.value = localStorage.text;//有内容直接显示，没内容不显示
}
btn = document.getElementById("btn");
btn.onclick = function(){
// alert(ta.value);
localStorage.text = ta.value;//点击之后将输入的数据保存
}
}
</script>
</head>
<body>
<textarea style="width: 200px;height: 200px" id="ta"></textarea>
<button id="btn">sava</button>
</body>
</html>
输入数据，点击save，退出浏览器再重进，依然还是原数据。
接着来看 sessionStorage：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script>
var num = 0;
var txt;
var btn;
window.onload = function(){
txt = document.getElementById("txt");
btn = document.getElementById("addbtn");
if(sessionStorage.num){
num = sessionStorage.num;
}else{
num = 0;
}
btn.onclick = function(){
num++;
sessionStorage.num = num;
showNum();
}
}
function showNum(){
txt.innerHTML = num;
}
</script>
</head>
<body>
<span id="txt">0</span>
<button id="addbtn">add</button>
</body>
</html>
连续点击add，数字一值增加，点击刷新，数值为0，但再次点击，数值为未刷新前的值+1。