今天整理了一下最近涉及到的一些知识点，然后重新更改了一下结果页用的文件。

1. sessionstorage和localstorage的区别

localStorage和sessionStorage一样都是用来存储客户端临时信息的对象，他们均只能存储字符串类型的对象（虽然规范中可以存储其他原生类型的对象，但是目前为止没有浏览器对其进行实现）。

localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在，而sessionStorage生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，那么所有通过sessionStorage存储的数据也就被清空了。

不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口），但是不同页面或标签页间无法共享sessionStorage的信息。

这两种storage方式，可以根据key（关键词）来存值，具体怎么存和取的已经在任务中用过了，但是目前还没有用过删除，删除方法如下：

sessionStorage.removeItem("key");

localStorage.removeItem("site");

这样可以删除指定key本地存储的值。

如果要清除所有的key/value，可以：

sessionStorage.clear(); 

localStorage.clear();

2. 重写了最终结果页的页面

最开始直接用了最初做任务写的页面，但是由于当时做任务页面布局用了bootstrap，所以嵌套方式较为复杂，并且类名很多，不方便进行js插入dom，试了几次发现容易把代码写的复杂并且报错比较多，所以改用flex重新布局，规范化类名，精简自己的代码

3. 断点调试

现在尝试着用断点调试的方法给自己的js代码debug，改了一部分代码

if (killer !=0) {
    $(".champ-player").append("杀手获胜");
    $(".end1").append("太棒了！你知道么？在捉鬼游戏中只有20%的杀手取得游戏最终的胜利哦！");
} else {
    $(".champ-player").append("平民获胜");
    $(".end1").append("太棒了！你打败了杀手，在游戏中取得了胜利！");
}

类似这种最终结果页的内容动态生成这种部分比较熟练了，但是经常会有无意义for循环

function addPlayer() {
    for (var i=0; i<playerStatus.length; i++) {
        if (playerStatus[i].identity == "平民") {
            playerFolk++;
        } else {
            playerKiller++;
        }
    }
    $(".killer").append(playerKiller);
    $(".folk").append(playerFolk);
}
addPlayer();

改了一下计数部分，最开始的计数部分有小问题，使用断点调试看实际程序怎么运作再反过来改代码

明天计划完成结果页开任务5，现在天数这里有小问题，导致生成结果页内容有问题，明天改掉

收获，storage的类型和应用，还有断点调试，断点调试这个部分准备后续继续深入一些。