这篇文章上次修改于 2080 天前，可能其部分内容已经发生变化，如有疑问可询问作者。

事件：发生的事情

event:事件对象，当一个事件发生时，和当前这个对象发生的这个事件有关的一些详细信息都会保留在一个指定的地方——event对象——必须在一个事件调用函数中使用
事件调用函数：一个函数是否是事件调用函数取决于调用的方式，而不是函数的定义
    ie/chrome：event是一个内置的全局对象
    火狐：事件对象通过在事件函数的第一个参数传入。

// alert(event);//undefined null 没有事件

    function fn1(ev){
/*
        alert(ev);//标准下
        alert(event);//非标准IE
*/
        var oEv = ev || event;//兼容标准和非标准
        for(var attr in oEv){
            console.log(attr + " = " + oEv[attr]);
        }
    } 

document.onclick  = fn1;//是事件调用函数，event有内容

事件流: 事件冒泡、事件捕获

    //    事件冒泡：当事件发生在内部元素上，这个事件会根据层级关系，逐级向上，直到事件对象的最顶层（window）

给一个对象绑定一个事件处理函数的第一种形式：obj.onclick = fn;

事件绑定的第二种形式：给一个对象的同一个事件绑定多个不同的函数——事件监听
addEventListener(事件名称, 事件函数, 是否捕获) ——标准，事件名称不加on;是否捕获：默认false冒泡，true捕获

区别：

    ie: 1、绑定事件：obj.attachEvent(事件名称,事件函数)
        2、没有捕获
        3、事件名称前面有on
        4、this——window
        5、事件函数的执行顺序：倒序
    chrome:1、绑定事件：obj.addEventListener(事件名称,事件函数, 
  是否捕获)
           2、有捕获
           3、事件名称前面没有on
           4、this——触发事件的对象
           5、事件函数的执行顺序：正序

取消监听 obj.removeEventListener(事件名称,事件函数,是否捕获)
// oBtn.removeEventListener('click',fn1,false);
// oBtn.removeEventListener('click',fn1,true);

 oBtn.attachEvent("onclick",fn1);
 oBtn.attachEvent("onclick",fn2);
 //ie obj.detachEvent(事件名称, 事件函数)
 oBtn.detachEvent("onclick",fn1);

要监听的事件--事件发生后要做什么--在什么时机触发：false（冒泡--出去事件时触发)、true（捕获--进入事件时触发）

return false; //阻止默认行为。当前这个行为在哪个事件中触发，就在哪个事件处理函数中使用return false

具体按键：event.key 按键的键值：event.keyCode 数字类型

document.onkeydown = function(ev){
    var oEv = ev || event;
    console.log(oEv.key);
    console.log(oEv.keyCode);
}

IE

  if(obj.setCapture){ //判断元素是否支持全局捕获
            obj.setCapture();
        }

   obj.releaseCapture();//释放全局捕获

 return false;

滚轮事件

    //    标准Chrome、IE obj.onmousewheel
    //    火狐 obj.addEventListener('DOMMuseScroll'，事件函数)  ——必须使用事件绑定

滚动鼠标滚轮box盒子的高度发生相应的变化，向上滚盒子高度减少，向下滚动盒子高度增加

    //    标准、IE event.wheelDelta   向上滚或向下滚
    //    火狐：event.detail   ？
    var oBox = document.getElementById('box');
    oBox.onmousewheel = fn;
    if (oBox.addEventListener) {
        oBox.addEventListener('DOMMouseScroll', fn);
    }

    function fn(ev) {
        var oEv = ev || event;
        //        console.log(oEv.wheelDelta); //标准 向上 120，向下 -120
        //        console.log(oEv.detail);//火狐 向上 -3，向下 3

        var tag = true; //向上true   向下false
        if (oEv.detail) {
            tag = oEv.detail < 0 ? true : false;
        } else {
            tag = oEv.wheelDelta > 0 ? true : false;
        }
        if (tag) {
            oBox.style.height = oBox.offsetHeight - 5 + "px";
        } else {
            oBox.style.height = oBox.offsetHeight + 5 + "px";
        }

    }