0121事件

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

DOM0事件监听方式：

• 内联方式，与CSS内联样式相对

• 事件处理程序的具体实现，在页面其它地方定义

DOM2事件监听方式：
addEventListener()，参数列表：

• 事件类型
• 事件处理方法
• 布尔参数，如果是true表示在捕获阶段调用事件处理程序，如果是false，则是在事件冒泡阶段处理

使用举例：

DOM0和DOM2事件监听使用区别：DOM2可以为事件添加多个处理程序

题目2： attachEvent与addEventListener的区别？

• 参数个数不同：attachEvent接收两个参数（事件名称和方法），addEventListener接收三个参数（事件类型、方法、布尔值）
• 第一个参数意义不同：addEventListener第一个参数是事件类型（比如click，load），而attachEvent第一个参数指明的是事件处理函数名称（onclick，onload）
• 事件处理程序的作用域不相同：addEventListener的作用域是元素本身，this是指的触发元素，而attachEvent事件处理程序会在全局变量内运行，this是window，所以刚才例子才会返回undefined，而不是元素id
• 为一个事件添加多个事件处理程序时，执行顺序不同：addEventListener添加会按照添加顺序执行，而attachEvent添加多个事件处理程序时顺序无规律(添加的方法少的时候大多是按添加顺序的反顺序执行的，但是添加的多了就无规律了)

题目3： 解释IE事件冒泡和DOM2事件传播机制？

IE事件冒泡：
DOM2事件传播：事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的元素

DOM2事件传播机制：事件开始时由最大的，不具体的元素接收，然后逐级向小的具体元素逐级传递，再反向传出

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

阻止事件冒泡：

• 标准事件模型：

stopPropagation()

• IE事件模型：

cancelBubble默认为false，设置为true后可以取消事件冒泡

阻止默认事件：

• 标准事件模型：

preventDefault()

• IE事件模型：

returnValue默认为true，设为false可以取消事件默认行为

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

    
这里是
    
饥人谷
    
前端6班

代码：

题目6： 补全代码，要求：

当点击按钮开头添加时在

这里是

元素前添加一个新元素，内容为用户输入的非空字符串；当点击结尾添加时在最后一个 li 元素后添加用户输入的非空字符串.
当点击每一个元素li时控制台展示该元素的文本内容。

    
这里是
    
饥人谷
    
任务班


开头添加
结尾添加

代码：

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

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

代码：