今天完成的事情：

   完成任务4法官台本界面

            游戏结束界面

            法官查看界面

明天计划的事情

   查看任务4有没有需要更改的地方

   有时间将CSS样式重新写一下

   准备小课堂PPT 

遇到的问题：

   1.通过点击元素p"第一天"，控制p的兄弟元素ul中的li（游戏步骤）的显示状态。

      首先为元素p绑定一个状态机，on表示未点击过，off表示点击过，初始状态为on

      然后通过P.nextElementSibling.childNodes获取li的集合。。

     （这种获取的集合中应该不仅包括li,还包括一些空白节点，空白节点此处没有影响，在网上查到了一个去处空白节点的方法，先mark一下，以后可能会用到。）

       function cleanWhitespace(oEelement)//定义一个删除空白节点的函数

           {

             for(var i=0;i<oEelement.childNodes.length;i++){

                      var node=oEelement.childNodes[i];

                       if(node.nodeType==3 && /^\s+/.test(node.nodeValue)){ 

                             node.parentNode.removeChild(node)//删除节点

                      }

             }

           } 

      最后做一个判断，通过on和off确定li的display。

   2.有个状态机应用的问题，在for循环里，先创建了一个状态机，然后在函数中引用状态机的触发事件，这时候webstrom会有一个黄色的警告，检查在嵌套函数中访问可变JavaScript变量，也就说变量one会在循环中不断被覆盖，虽然有黄色报警，但是运行起来没有问题，是不是我这种写法不规范。

for (var y=0;y<5;y++){
       var one = new Switchstate_2();
    btn_over.onclick = function () {
             one.event();
    }
}

收获：  任务4下来学习的东西还是很多的，后续有时间可以将代码改进一些，复用的位置都可以提出来优化一下。