localStorage，之前还在猛投简历，应付面试的时候倒是听说过，只不过没有深入研究，只知道在之前是用cookie缓存页面信息，现在主流浏览器都支持localStorage。在学生时期去学习前端几乎不可能了解到这一神奇是如何工作和使用的。
在HTML5中，本地存储是一个window的属性，包括localStorage和sessionStorage，从名字应该可以很清楚的辨认二者的区别，前者是一直存在本地的，后者只是伴随着session，窗口一旦关闭就没了。二者用法完全相同，这里以localStorage为例。
存储数据的方法就是直接给window.localStorage添加一个属性，然后给他赋值，比如：
localStorage.a = 3;//设置a为”3″localStorage[“a”] = “sfsf”;//设置a为”sfsf”，覆盖上面的值localStorage.setItem(“b”,”isaac”);//设置b为”isaac”
获取数据的方式也很简单：
b = localStorage.getItem(“b”);//获取b的值
当然，我们推荐使用getItem()，和setItem()的方式获取和存储数据，这不多说了。 除此之外，我们移除数据就是用removeItem(),像这样：
localStorage.removeItem(“c”);//清除c的值
这只是移除其中的一个，如果要把整个localStorage的值清空的话，就用
localStorage.clear();
使用这种方式遍历localStorage的属性值：
for(var i=0;i<localStorage.length;i++){ //key(i)获得相应的键，再用getItem()方法获得对应的值 console.log(localStorage.key(i)+ ” : ” + localStorage.getItem(localStorage.key(i)) + “<br>”); }
相信到这里，我们也都了解了localStorage的用法了。接下来我们就用它做点实事，锚点定位。比如：
一个页面上我们有好多的列表单元，每一个都是可以点进去访问的，但是列表里的活动比较多，鼠标滑动到了底部，我进入本页面最后一个活动查看，查看完毕退出来，我们希望视线还停留在刚才点击的那个活动上，如果我们不做任何设置，页面一定又刷新了一遍回到了最顶端。这样用户体验很不好。我们可以用localStorage来解决这个定位的问题。 布局如下：
>==>==>==>==>==>==>==></li></ul>
js代码如下（jQuery）：
$((localStorage){//判断浏览器是否支持localStorage localStorage.setItem(“dataNum”,parseInt($(this).attr(“datanum”)));}window.location.href = $(this).attr(“data-href”);//点击单个活动，跳转到data-href所指的页面，与此同时，，给localStorage的dataNum属性赋值，即把每个活动单元的序列号存了起来。});if(localStorage.getItem(“dataNum”)){setTimeout(height=$(scrollTop=height*dataNum+$(“.recommandAct”).height()+$(“header”).height()+$(“.cityChoose”).height();//计算再次回到页面时停留在视野的位置$(document).scrollTop(scrollTop);//回滚},100);}
因为localStorage的属性值是一旦获取就会从存下来，除非手动清楚(调用.clear()方法)。所以我们从那个详情页返回来时，刚才点击获取的活动序列号浏览器还存着，因此，根据那段js代码
scrollTop=height*dataNum+).height()+$(“.cityChoose”).height();$(document).scrollTop(scrollTop);
可以快速的会滚到刚才点击的位置，就像是页面记住了我们的位置一样。
利用localStorage还可以做好多事情，比如我们可以记录页面刷新的次数等等。其他的新用法等待我们去发现吧。
第一个青春是上帝给的;第二个的青春是靠自己努力的
