进阶9作业

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

题目2： attachEvent与addEventListener的区别？

主要几个区别
1、 参数个数不相同
2、 第一个参数意义不同
3、 事件处理程序的作用域不相同, addEventListener的作用域是元素本身，this是指的触发元素,而attachEvent事件处理程序会在全局变量内运行，this是window。
4、 为一个事件添加多个事件处理程序时，执行顺序不同，addEventListener添加会按照
添加顺序执行，而attachEvent添加多个事件处理程序时顺序无规律(添加的方法少的时候大多是按添加顺序的反顺序执行的,但是添加的多了就无规律了),所以添加多个的时候,不依赖执行顺序的还好，若依赖于函数执行顺序，最好自己处理，不要指望浏览器。

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

IE事件冒泡: 即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接受，然后
逐级向上传播至最不具体的那个节点(文档)。
DOM2级事件规定事件流包括三个阶段: 事件捕获阶段，处于目标阶段和事件冒泡阶段。首先发生的是事件捕获，为截获事件提供了机会。然后是实际的目标接受到事件。最后一个阶段是冒泡阶段。
举列说明

    

        

            点我
        
    
    

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

function stopPropagation(e) {
    if(e.stopPropagation)
        e.stopPropagation();   
    else
        e.cancelBubble = true;    // 兼容IE
}
function preventDefault(e) {
    if(e.preventDefault)
        e.preventDefault();
    else
        e.returnValue = false;  // 兼容IE  
} 
function getEvent(e) {
    return e || window.event;
}

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

    
这里是
    
饥人谷
    
前端6班

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

当点击按钮开头添加时在

这里是

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

    
这里是
    
饥人谷
    
任务班


开头添加
结尾添加

效果展示

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

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

效果展示
题目8： 写一篇博客，讲解事件相关知识点，如事件冒泡、捕获、代理、兼容写法等(选做题目)
事件代理