今天主要完成了两个部分的工作，一是完成了对之前任务3的bug修改，二是进行了任务4

1. 关于任务3的页面跳转

最开始写的页面跳转是根据if函数进行判断，var i = 0；当i的值小于人数时，进行页面跳转转换玩家身份和编号，但是在最后一页的时候会出现玩家身份分派出错和页面不能及时跳转的问题，几经修改改成最后一个页面进行else if判断

else if (i=num) {
    $(".ids").html(roles[(i-1)]);
    console.log(roles[(i-1)]);
    $(".idCard").css("display","block");
    $(".identification").css("display","none");
    $("#start").css("display","none");
    $("#end").css("display","block");
    $(".nub-b").html(b);
}

直接改变最后一个页面各个块级元素的display属性，并且单独插入一次玩家身份

2. 任务4部分分为很多个模块

任务4界面和法官台本基本相同，但是试了一下感觉通过页面跳转的function改变元素display属性比较复杂，所以重新写了一个html页面进行跳转。

首先是根据玩家人数和身份插入div块，这个思路和之前的一样

for (var i=0; i<num; i++) {
    function  addUnit() {
        $(".row").append(
            '<div class="unit">' +
            '<div class="square">' +
            '<div class="identification">' + roles[i] +
            "</div>" +'<div class="number">' + (i+1) + '号' +
            '</div>' + '</div>' +
            '</div>'
        );
    }

这里温习了一个CSS布局小技巧，如果使用float布局，用margin进行布局调整，虽然可以自动换行，但是不能在页面内均匀分布，所以将所有的玩家编号单元放在一行内，设定margin，使用flex布局，然后使用space-between让元素自己在页面内部进行距离调整，然后使用flex-warp： warp；让元素自动换行，最终的页面布局就很理想。

接下来是对任务进行分析。

感觉任务4相对来说有一定难度，首先是要给所有玩家添加属性，设置初始属性为“alive”，为每个玩家编号单元增添一个click事件，使点击时选中的玩家（除杀手）可以将属性变为“dead”，这里既要考虑不能杀杀手，也要不能重复杀人或者多次杀人。

依旧通过每一个button进行页面跳转

roleStatus[i] = {};
roleStatus[i].identity = roles[i];
roleStatus[i].status = "alive";

定义i = 0，然后定义roleStatus对象，为对象添加多个属性

cards[j].style.cursor = "not-allowed";

为杀手添加“不可点击”属性（通过cursor：not-allowed；）

目前写完的部分发现可以一次杀多个平民，明天开始进行去重和roleStatus对象属性的完善，并且储存属性，争取早点完成任务4。

今天的收获主要是知道了“this”和“index”这两个用法

this：http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html

index：http://www.w3school.com.cn/jsref/prop_option_index.asp

目前用的不熟练而且理解不够深，准备多看一点相关资料

遇到的问题

发现对操作的对象理解程度不够，有些部分本应该是对dom节点的操作却抓取了字符串进行操作

还有一个问题，this看了一部分文章但是还是不太理解