4.dom高级事件笔记总结

注册事件：

两种方式

传统注册： 1.<button onclick= "alert('hi')"></button> 2.btn.onclick = function(){}

监听注册的方式

IE9以上：注册对象.addEventListener（type,Listener [, useCapture]）

eventTarget.addEventListener()方法将指定的监听器注册到 eventTarget（目标对象）上，当该对象触发指定的事件时，就会执行事件处理函数。

IE9以下：attacheEvent（）IE678支持

eventTarget.attachEvent()方法将指定的监听器注册到 eventTarget（目标对象） 上，当该对象触发指定的事件时，指定的回调函数就会被执行。

事件监听兼容性解决方案：

封装一个函数，函数中判断浏览器的类型：

删除事件（解绑事件）

删除事件兼容性解决方案：

    <div>1</div>
    <div>2</div>
    <div>3</div>
    <script>
        var divs = document.querySelectorAll('div');
        divs[0].onclick = function() {
            alert(11);
            // 1. 传统方式删除事件
            divs[0].onclick = null;
        }
        // 2. removeEventListener 删除事件
        divs[1].addEventListener('click', fn) // 里面的fn 不需要调用加小括号
        function fn() {
            alert(22);
            divs[1].removeEventListener('click', fn);
        }
        // 3. detachEvent
        divs[2].attachEvent('onclick', fn1);

        function fn1() {
            alert(33);
            divs[2].detachEvent('onclick', fn1);
        }
    </script>