今天完成的事情：1、完成任务2玩家配比页面的滑动条；

                           2、以及滑动监听事件。

明天计划的事情：1、准备小课堂

                           2、利用if条件判断和算术运算符，完成人数的自动配置；

                           3、查询相关资料完成创建数组；

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

遇到的问题：如何写出滑动条样式（已解决）；如何监听事件（已解决）。

收获：学习到用input的range来书写滑动条。

         利用oninput="action(this.value)" onchange="action(this.value)进行对滑块移动的监听。

滑动条：

刚开始百度了很多滑动条的书写，原理大概是利用容器和滑块的posion，和滑块float运动，再基于时间监听计算浮动的距离换算成所需要的数据。

因为代码量很多，然后看了好长时间，对其中的东西，依旧没有弄的很清楚，就放弃。

然后继续查资料，在https://www.cnblogs.com/zhangjunfeng/p/6705924.html里看到了input里自带的滑动条模型（type="range"）

<input type="range" name="points" min="4" max="18" id="slider" >

事件监听：

也用了好多标签，但都没有成功，原因现在还没查清楚。

然后找到：oninput="脚本名()"  onchange="脚本名()"

oninput 事件在用户输入时触发。该事件在 <input> 或 <textarea> 元素的值发生改变时触发。

onchange 事件会在域的内容改变时发生。

区别：oninput 事件在元素值发生变化是立即触发，onchange 在元素失去焦点时触发。

另外一点不同是 onchange 事件也可以作用于 <keygen> 和 <select> 元素。

同时使用就可保证事件即时生效。

<input type="range" name="points" min="4" max="18" id="slider" oninput="action(this.value)" onchange="action(this.value)"/>

function action(a) {
    document.getElementById("killerNum").innerHTML= "杀    手  " + a + "  人;"
    document.getElementById("writeNum").value= a ;
}

即：当滑块移动就运行名为“action”的脚本，并将此input的value值带入进去。

发现问题：在使此input内容与 id=writeNum的input同步时，同步不生效。

原因：是因为刚开始后缀的错误，应该是.value，而不是.innerHTML。

解决方案：

 document.getElementById("writeNum").innerHTML= a ; 错误

 document.getElementById("writeNum").value= a ;正确