2017年2月16日

1.今天完成：

今天主要做了任务4的最后两张页面，以及页面涉及到的功能的实现。同时看了json的一些知识，json作为数据交换的格式，还是很重要的。写任务4时，怎么动态的生成任务4-3的一些元素，还是颇费一般功夫的。比如：

 var element = document.getElementById("container");

    //创建子元素节点
    var column = document.createElement("div");
    var box = document.createElement("div");
    var role = document.createElement("div");
    var serial = document.createElement("div");

    //创建子元素文本节点
    var node1 = document.createTextNode(i+"号");
    var node2 = document.createTextNode("杀手");
    var node3 = document.createTextNode("水民");

    //继续创建子元素节点
    var ul = document.createElement("ul");
    var liFirst = document.createElement("li");
    var liSecond = document.createElement("li");
    var liThree = document.createElement("li");
    var liForth = document.createElement("li");

    //给元素节点添加类名
    column.className = "col-xs-4";
    box.className = "box";
    role.className = "identity";
    serial.className = "order-num";
    ul.className = "sprite";
    liFirst.className = "knife";
    liSecond.className = "search";
    liThree.className = "location";
    liForth.className = "plus";

    //给父元素添加子元素
    if(killer.indexOf(i) != -1){
        box.appendChild(role);
        role.appendChild(node2);
    } else {
        box.appendChild(role);
        role.appendChild(node3);
    }
    element.appendChild(column);
    column.appendChild(box);
    box.appendChild(serial);
    serial.appendChild(node1);
    column.appendChild(ul);
    ul.appendChild(liFirst);
    ul.appendChild(liSecond);
    ul.appendChild(liThree);
    ul.appendChild(liForth);
}

这些元素的创建，首先你要分析好，有几层父元素，有几层子元素，它们之间是怎么嵌套的，刚开始我就写错了，通过排查，发现多谢了一层父元素。

2.遇到问题：

没甚么问题，就是提高学习效率。。。。

3.今天收获：

学习怎么动态创建元素，怎么动态添加元素样式。

对一个数组 filter、some、map、foreach的操作分别是什么作用？

filter(),对数组的每一项运行一项给定函数，如果该函数对每一项都返回true,则返回true.

some(),对数组的每一项运行一项给定函数，如果该函数任一项返回true,则返回true.

map(),对数组的每一项运行一项给定函数，返回每次函数调用返回的结果组成的数组。

forEach(),对数组的每一项运行一项给定函数，这个方法没有返回值。

4.明日计划：

完成任务4，开始任务5.