快速上手html5 localStorage

localstorage是html5的新特性，相对于数据不能超过4kb的cookie，localstorage不仅可达到5mb的大小，还可以无限期的储存，而localstorage的另一种特性sessionStorage则是仅支持当前浏览器关闭前有效储存，用法仍是相同但localstorage并不支持ie8及以下的浏览器，cookie在低版本浏览器仍是不可舍弃的功能。不多说，直接开始上手localStorage。

<script type="text/javascript">
		if (localStorage.times){
		  localStorage.times=Number(localStorage.times) +1;
		}
		else{
		  localStorage.times=1;
		}
		document.write("登录了 "+ localStorage.times + "次");
</script>

代码中可以看出来，可以直接在localStorage中定义一个变量，变量会被直接储存到本地当中，每次刷新就times+1。

当我们到一定程度不需要localStorage需要删除本地数据时，我们可以直接利用clear()删除

if (localStorage.times){
			if(localStorage.times>=10){
				localStorage.clear();
			}else{
			  	localStorage.times=Number(localStorage.times) +1;
			}
		}
		else{
		  localStorage.times=1;
		}
		document.write("登录了 "+ localStorage.times + " 次");

可以看到，当times>=10时，数据被删除，times变成undefined。 还有一点，localStorage里储存的值只是字符串，需要手动转换为数字。

我们也可以用setItem去设置，效果一致。

if(localStorage){
			localStorage.setItem('times',10);
		}
		
		document.write("登录了 "+ localStorage.getItem('times') + " 次");

在使用localStorage的时候也要注意，他有永久储存的机制，需要自己手动写JS文件去删除，还有localStorage是不能跨浏览器使用的，只能取各自浏览器的值。

转载于:https://my.oschina.net/u/3084690/blog/795906