今天完成的事情：进行了小课堂，

                            完成滑块监听事件，以及了最少人数的判断，

                            并为range滑块添加点击增加减少数值。
明天计划的事情：1 查询相关资料完成创建数组；

                        2 利用洗牌算法将数组打乱，并分配给玩家

遇到的问题：用+计算的时候，却出现字串符相连（已解决）、button中的文字在垂直方向不居中。
收获：学习监听事件，进一步运用if判断，加深运算符“+”的理解，加深document的运用

小课堂反思：

今天第一次进行小课堂，然后在上周安排小课堂后，没有进行小课堂ppt计划安排，导致今天很长时间都在准备小课堂，导致耽误任务程度。

另外小课堂也没认真看要求，导致在讲的时候忘了进行代码延时。

改变：1、以后小课堂应按照要求，每天准备一小时，而不是临时抱佛脚。

           2、注重小课堂的质量，这有关以后面试问答，按照流程要求，完成小课堂。

最少人数判断.                                                                                                                                                                    

function sliderNum(playerNum) {
    document.getElementById("writeNum").value= playerNum ;//使滑块的value值与书写输入value的值相等
    minPlayerNum(playerNum);//进行人数判断
}
function writeNum(playerNum) {
    document.getElementById("sliderNum").value= playerNum ;//使书写输入value值与滑块value的值相等
    minPlayerNum(playerNum);//进行人数判断
}
//人数判断
  function minPlayerNum(playerNum) {
    
     if(playerNum>4) {killerNum=1;//总人数大于4，则杀手为1个
        if(playerNum>8){killerNum=2;//总人数大于4，则杀手为2个
            if(playerNum>12){killerNum=3;//总人数大于4，则杀手为3个
                if(playerNum>16){killerNum=4;//总人数大于4，则杀手为4个
                 }}}}
   civilianNum =playerNum-killerNum;//平民人数
    document.getElementById("killerNum").innerHTML= "杀    手  " + killerNum + "  人;";//显示杀手人数
    document.getElementById("civilianNum").innerHTML= "平    民  " + civilianNum + "  人;";//显示平民人数
}

对range的value数值加减                                                                                                                              

（第一代）此时addNum函数不能一次只加1，而是加满

function reduceNum() 
    document.getElementById("sliderNum").value = document.getElementById("sliderNum").value - 1;
    sliderNum(document.getElementById("sliderNum").value);
}
function addNum() {
  document.getElementById("sliderNum").value = document.getElementById("sliderNum").value + 1;
  sliderNum(document.getElementById("sliderNum").value);
}

（第二代）改变addNum函数改成 - -1；能实现一次加1的效果，但原理现在不知道。

function addNum() {
   document.getElementById("sliderNum").value = document.getElementById("sliderNum").value - -1;
  sliderNum(document.getElementById("sliderNum").value);
}

（第三代）

发现原因：js中如何进行加法运算+都当作字符串连接了。

解决方案： var b = parseFloat（）

function addNum() {
    document.getElementById("sliderNum").value =parseFloat( document.getElementById("sliderNum").value) + 1;
    sliderNum(document.getElementById("sliderNum").value);
}

button中的文字在垂直方向不居中                                                                                                         

解决方案：添加padding值，但为什么不垂直居中，原因未知。

button去除默认点击效果outline: none;