今天完成的事情：

1.萝卜多的准备工作。github上创建项目，关联本地。阅读需求文档，看demo。

2.阅读原型和接口文档，总结前台需要特别注意的点以及相应的解决办法。

3.制作关于event delegate的相关的PPT。

遇到的问题：

重装电脑后webstorm上传更新到github 报错：

error setting certificate verify locations:（设置证书的验证位置错误）

解决办法：尝试找了证书的位置没找到所以

gitBash中输入：git config --system http.sslverify false（忽略证书错误）

明天计划的事情：

1.总结的PPT，

2.萝卜多后台文档的阅读，以及大致的制定相关的解决方案。

收获：

主要关于event delegate以及事件处理流程。

总结的PPT内容如下：

什么是事件处理？

事件处理程序可以为现代web应用程序提供交互能力，因此许多开发人员会向页面中添加大量的处理程序。但是在JavaScript中，添加到页面中的事件处理程序的数量会直接影响页面的整体运行性能。

理由：

1.每个函数都是对象，都会占用内存。

2.事先指定所有的事件处理程序会导致DOM的访问次数增加，会延迟整个页面的交互时间。

对“事件处理程序过多”问题的解决方案就是事件委托（Delegation）。--JavaScript高级程序设计

3.事件委托的基本实现方式：在DOM树中尽量高的节点添加事件处理程序，代替在其多个子节点中添加。

今天就主要介绍一下javascript delegate的用法和原理，以及jQuery等框架中delegate的应用。

2.3 事件冒泡及捕获

DOM2.0模型将事件处理流程分为三个阶段：一、事件捕获阶段，二、事件目标阶段，三、事件起泡阶段。如图：

事件捕获：当某个元素触发某个事件（如onclick），顶层对象document就会发出一个事件流，随着DOM树的节点向目标元素节点流去，直到到达事件真正发生的目标元素。在这个过程中，事件相应的监听函数是不会被触发的。

事件目标：当到达目标元素之后，执行目标元素该事件相应的处理函数。如果没有绑定监听函数，那就不执行。

事件起泡：从目标元素开始，往顶层元素传播。途中如果有节点绑定了相应的事件处理函数，这些函数都会被触发。

2.4事件委托的优点

通过刚才的对比介绍，大家应该能够体会到使用事件委托对于web应用程序带来的几个优点：

1.管理的函数变少了。不需要为每个元素都添加监听函数。对于同一个父节点下面类似的子元素，可以通过委托给父元素的监听函数来处理事件。

2.可以方便地动态添加和修改元素，不需要因为元素的改动而修改事件绑定。

3.JavaScript和DOM节点之间的关联变少了，这样也就减少了因循环引用而带来的内存泄漏发生的概率。

3.常见问题

在jQuery中如何使用delegate方法？

jQuery的delegate的方法有四个参数，childSelector，一个事件名称，规定传递到函数的额外数据（可选），和事件处理函数。

$(selector).delegate(childSelector,event,data,function)

什么样的事件可以用事件委托，什么样的事件不可以用呢？

适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。（所有用到按钮的事件，多数的鼠标事件和键盘事件）

值得注意的是，mouseover和mouseout虽然也有事件冒泡，但是处理它们的时候需要特别的注意，因为需要经常计算它们的位置，处理起来不太容易。

不适合的就有很多了，举个例子，mousemove，每次都要计算它的位置，非常不好把控，在不如说focus，blur之类的，本身就没用冒泡的特性，自然就不能用事件委托了。