今天完成的事：了解了一部分的本地储存；以及一些之前新的没怎么用过的东西

明天要完成的事：继续任务2；并且对任务2的2种思路分别研究

难题：写起来的时候思路乱了：首先提取之前页面的数据；

后面的思路倒是没问题：通过计算点击按钮的次数确定现在是显示或隐藏并且通过判断次数来进入下一个界面并删除或者重置次数；

然后就卡在这了输出的本来是数字后面不知道哪改了变成输出nan实在找不到直接重新写还是输出nan

后面发现之前没有数组；没想到怎么创建一个数组

后面重新创建了一个数组但是还没想好怎么使用可以分成2个数组或者是一个数组11111122这样去排序但是还没想好先看下后面那个界面要怎么去识别身份或者赋予身份这个还没想好；另外没想好怎么储存数组；这个确实比较懵逼；其实也可以不用储存数组而是直接在下个界面用之前储存的数字来创建数组；还没想太好

收获：

Window localStorage 属性

储存：localStorage.setItem("key", "value");

提取：var lastname = localStorage.getItem("key");

删除：localStorage.removeItem("key");

返回值：一个储存对象

localStorage 的优势

•  1、localStorage 拓展了 cookie 的 4K 限制。
•  2、localStorage 会可以将第一次请求的数据直接存储到本地，这个相当于一个 5M 大小的针对于前端页面的数据库，相比于 cookie 可以节约带宽，但是这个却是只有在高版本的浏览器中才支持的。

localStorage 的局限

•  1、浏览器的大小不统一，并且在 IE8 以上的 IE 版本才支持 localStorage 这个属性。
•  2、目前所有的浏览器中都会把localStorage的值类型限定为string类型，这个在对我们日常比较常见的JSON对象类型需要一些转换。
•  3、localStorage在浏览器的隐私模式下面是不可读取的。
•  4、localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，会导致页面变卡。
•  5、localStorage不能被爬虫抓取到。

localStorage 与 sessionStorage 的唯一一点区别就是 localStorage 属于永久性存储，而 sessionStorage 属于当会话结束的时候，sessionStorage 中的键值对会被清空。

 localStorage 本身的特点有关，localStorage 只支持 string 类型的存储。

Window sessionStorage 属性

保存数据语法：sessionStorage.setItem("key", "value");

读取数据语法：var lastname = sessionStorage.getItem("key");

删除指定键的数据语法：sessionStorage.removeItem("key");

删除所有数据：sessionStorage.clear();

返回值：一个储存对象

（这两个主要区别在于关闭浏览器之后数据还存不存在）

相关阅读：

cookies、sessionStorage和localStorage解释及区别：https://www.cnblogs.com/pengc/p/8714475.html

WebStorage提供了一些方法，数据操作比cookie方便；

　　　　setItem (key, value) ——  保存数据，以键值对的方式储存信息。

      　　 getItem (key) ——  获取数据，将键值传入，即可获取到对应的value值。

        　　removeItem (key) ——  删除单个数据，根据键值移除对应的信息。

        　　clear () ——  删除所有的数据

        　　key (index) —— 获取某个索引的key

写到后面又感觉不是很对我得先有数组吗？一定要数组吗？还是比较奇怪；不能根据当前点击次数去判断是第几个玩家吗；嗯回想一下通过什么去判断他的身份呢？？这个身份到底是以一个什么形式存在的这是当前的主要问题：

后面想了一下既要有顺序各自区别又要有共同区别（就是1号和2号以及3号这种区别还要有水民和杀手的区别）

另外：顺序区别好办；i+1一个循环即可；水民和杀手的区别应该也可以这样就是2种循环即i+1一种循环创建玩家的同时创建顺序；并且在写2个循环i=1和1=2并通过1和2确定玩家身份并且加上数组乱序；通过2个数组来确定玩家的位置和身份并确保不会相互影响

完成了我的设想；但是出现了新的问题；如何计算进行到了哪一步；

我想用储存点击事件但是他不稳定极其不稳定；

而且在实现时很麻烦；点击次为奇数时，和点击数为偶数时有不同的处理即可

另外更改文档的html和css都需要实事先申明必须；并且id比class好用用class改html完全没反应；