离线数据存储
页面中可能会有这种需求，一个文本框，刷新或者浏览器重启之后，里面的内容仍然保留着。传统的cookie因为其容量有限，难以满足要求。考虑到现代浏览器（非IE）一般都是支持html5的，可以利用本地存储的方法实现
localStorage.setItem('key','Hello World');
var value = localStorage.getItem('key');
IE早期的版本不支持这种方式，但是可以通过另外一种方式来实现：
首先设置一个html元素的style属性：
<div id="dataStore"></div>
通过javascript控制
View Code
//设值
var ds = document.getElementById("dataStore");
ds.setAttribute("val",this.value);
ds.save("BookInfo");
//取值：
var ds = document.getElementById("dataStore");
ds.load("BookInfo");
tt.value=ds.getAttribute("val");
上面的存储方式可以再每个域中存储100k数据
下面模拟一下新浪微博发微博的文本框（每次内容更新，但是未提交的时候，都会保存在浏览器上，下次打开该浏览器的时候，内容依然会显示在文本框里）：
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="GBK">
<title>IE本地数据存储</title>
</head>
<body>
<textarea id="tt" name="" rows="20" cols="100"></textarea>
<div id="dataStore"></div>
<script type="text/javascript">
//取值
(function(){
var tt = document.getElementById("tt"),
ds = document.getElementById("dataStore"),
value = '';
try{
value = localStorage.getItem('key');
}catch(error){
ds.load("BookInfo");
value = ds.getAttribute("val");
}
tt.value = value;
})();
</script>
<script type="text/javascript">
//设值
(function(){
var tt = document.getElementById("tt"),
ds = document.getElementById("dataStore");
tt.onchange = function(){
try{
localStorage.setItem('key',this.value);
}catch(e){
ds.setAttribute("key",this.value);
ds.save("BookInfo");
}
}
})();
</script>
</body>
</html>
