心血来潮突然想做一个计分器:记录每个玩家每一局的得分、总分,以及能将数据保存起来。
界面显示方面想用框架做成响应式的页面,就用了bootstrap框架。
比较重要的是数据保存方面,一个小页面用数据库比较好像不怎么样,然后就找到了两个方案:
1、将数据保存在cookie。
2、将数据保存在sessionStorage或localStorage。
由于cookie在数量方面限制比较大(一个域名限制了只有几十个),而sessionStorage和localStorage是html5的本地存储,sessionStorage在关闭浏览器后会自动清除,localStorage只有手动清除才会过期,所以最后选择了localStorage来存储数据。
localStorage的相关操作:
- //赋值
- localStorage.abc = 1; //将abc设置为1
- localStorage.setItem("abc","isaac"); //将abc设置为1
- //获取值
- var a = localStorage.a;//获取a的值
- var b = localStorage.getItem("b");//获取b的值
- //清除值
- localStorage.removeItem("c"); //清除c的值
- localStorage.clear(); //清除所有值
计分器demo:http://www.risingsun.cc/jfq/
源码:https://github.com/leisu168/jifenqi/