今日完成：

完成任务三

发牌需要用到洗牌算法：

i = card.length-1;

取一个[0,i]的随机数n;

取card数组中下标为n的数与数组最后一个数(card[i])互换。

然后再取[0,i-1]的随机数n，

取card数组中下标为n的数与数组倒数第二个数（card[i-1]）互换。

依次类推，直到将数组中的数全部随机完。

 let n;
 let m;
 const card = [1,2,3,4,5,6];
for (let i = card.length-1; i>=0; i--){
    console.log(i);
     n = Math.floor(Math.random()*(i+1));
     console.log("随机数："+n);
     m = card[n];
     card[n] = card[i];
     card[i] = m;
}
console.log(card);

算法整体就是在数组内随机整合，将随机出来的牌放后面。类似从一副牌里随机抽，抽出来的牌放在另一块，直到抽完。唯一的区别就是这个是在一个数组内进行的。

这个算法的时间复杂度为O(n);

将分配好的角色放入一个数组中，并调用洗牌方法打乱，然后存储在浏览器中，供后面翻牌使用。

function shuffle(card) {
    let n;
    let m;
    for (let i = card.length - 1; i >= 0; i--) {
        console.log(i);
        n = Math.floor(Math.random() * (i + 1));
        console.log("随机数：" + n);
        m = card[n];
        card[n] = card[i];
        card[i] = m;
    }
    return card;
}

var card=[];

for (let i=0;i<killer_num-1;i++){
    card.push(1);
}
for (let i=0;i<vulgar_num-1;i++){
    card.push(0);
}
localStorage.setItem('card',shuffle(card));

数组中的1代表杀手，0代表平民

给查看身份页面的按钮添加点击事件

<button class="card-btn" id="card-b" onclick="show()">
    查看1号身份
</button>

function show() {
    var card_btn = document.getElementById('card-b');
    var cid = document.getElementById('cid');
    var name = document.getElementById('name');
    var top_num = cid.innerHTML;
    var bot_num = card_btn.innerHTML.replace(/[^\d]/g, '');
    var pic = document.getElementById('pic');
    if (bot_num===''){
        alert("法官查看");
    }else {
        if (top_num === bot_num) {
            pic.src = "../img/user.png";
            if (card[top_num-1] === 1) {
                name.innerHTML = '狼人';
            } else {
                console.log(card[top_num]+"card[x]");
                name.innerHTML = '平民';
            }
            console.log("id:"+top_num);
            console.log(typeof parseInt(top_num));
            console.log(card.length);


            if (parseInt(top_num)===card.length){
                card_btn.innerHTML = "法官查看";
            }else {
                top_num = parseInt(top_num) + 1;
                console.log(top_num + "top_num");
                card_btn.innerHTML = "隐藏并传递给" + top_num + "号";
            }


        } else {
            pic.src = "../img/card.png";

            cid.innerHTML = parseInt(cid.innerHTML) + 1;
            name.innerHTML = "";
            card_btn.innerHTML = "查看" + cid.innerHTML + "身份";
        }

    }
}

大体思路就是根据当前页面中的一些信息去判断点击事件需要进行的操作是什么

比如：

当按钮中的内容没有数字时，可判定该按钮为”法官查看“。

当卡片上方的数字和下方按钮的数字相同时，点击按钮的操作则是亮牌的操作。

当卡片上方的数字和下方按钮的数字不同时，点击按钮的操作则是隐藏传递的操作。

对了，还要设置边界条件，当上方id等于card数组的length时，则修改按钮信息为“法官查看“。

看下效果：

遇到的问题：

使用浏览器存储localStorage时，发现存进去的是数组，取出来的是字符串。

localStorage.setItem('card',JSON.stringify(shuffle(card)));

解决方法是将其转化为json字符串。

var card = JSON.parse(localStorage.getItem('card'));

明日计划：

继续完成任务