DOM事件

• 1 DOM0 事件和DOM2级在事件监听使用方式上有什么区别？

Dom0事件将函数赋值给事件处理程序属性。此时的事件处理程序会被认为是元素的方法。事件处理程序会在元素的作用域中运行，this指向当前元素.
添加多个事件处理程序会被覆盖，执行最后一个

Dom2定义了两个方法，用于处理删除和指定事件的处理程序的操作：addEventListener() 和 removerEventListener()；
与Dom0相比可以给一个元素添加多个相同或不同的事件处理，this指向元素本身

• 2 attachEvent与addEventListener的区别？

1. IE事件处理程序attachEvent: 事件处理程序会在全局中运行,因此this=window
   IE8以及更早版本只支持事件冒泡
   事件类型加on
   添加2个相同的事件会先执行后一个，在执行前一个
   第二个参数为处理函数，主要加函数名。否则无法删除

2.非IE事件处理程序addEventListner: 事件处理程序在其依赖的元素的作用域运行，与IE相反
与IE相对应不仅支持事件冒泡，还支持事件捕获.称事件流
addEventLister()的第三个参数可以修改冒泡或者捕获
第二个参数为处理函数，主要加函数名。否则无法删除

• 3 解释IE事件冒泡和DOM2事件传播机制？

qq 20170511000152

IE事件冒泡重element2->element1->body->html
IE的事件流事件冒泡，从嵌套最深的节点接收逐级向上传播到根节点

qq 20170511000201

DOM2级事件规定的事件流包括3个阶段：事件捕获阶段 处于目标阶段 冒泡阶段
首先发生的是事件捕获，为截获事件提供了机会。然后是实际的目标接受事件。最后一个阶段是冒泡阶> >段，可以在这个阶段对时间对出响应

• 4：如何阻止事件冒泡？ 如何阻止默认事件？

非IE阻止事件冒泡：e.stopPropagation()
非IE阻默认事件   e.preventDefault()

IE阻止事件冒泡：e.cancelable
IE阻默认事件   e.returnValue

• 5 有如下代码，要求当点击每一个元素li时控制台展示该元素的文本内容。不考虑兼容
  代码地址

    
这里是
    
饥人谷
    
前端6班

• 6 补全代码，要求：当点击按钮开头添加时在
• 这里是
元素前添加一个新元素，内容为用户输入的非空字符串；当点击结尾添加时在最后一个 li 元素后添加用户输入的非空字符串.
当点击每一个元素li时控制台展示该元素的文本内容。
代码地址

    
这里是
    
饥人谷
    
任务班



开头添加
结尾添加

• 7 补全代码，要求：当鼠标放置在li元素上，会在img-preview里展示当前li元素的data-img对应的图片。
  代码地址

    
鼠标放置查看图片1
    
鼠标放置查看图片2
    
鼠标放置查看图片3

• 8