day11-事件

1.    事件对象兼容（兼容IE）

        e    =    e || window.event;

2.    鼠标事件及方法；

属性名                          含义

e.buttons                       返回鼠标点击按键（1左键，2右键，4中键滚轮）

e.offsetX / offsetY          获取事件触发最近的盒子（事件源）的坐标

e.clientX / clientY          获取可视区的坐标（根据浏览器的定位）

e.screenX / screenY     获取整个屏幕的坐标

e.pageX / e.pageY        获取文档的坐标（包含滚动条）

3.    获取键码兼容

    e.keyCode || e.which

4.    特殊键码：是否按下alt  ctrl  和 shift

    e.altKey    e.ctrlKey    e.shiftKey    返回值是布尔值；

可以用来判断组合键

if（e.keyCode==13    &&    e.altKey）{

     alert('同时按下了enter和alt')；

}

5.    阻止默认事件（有兼容）

if(    e.preventDefault    ) {

       e.preventDefault();

    }else {

    window.event.returnValue = false;    

    //return false;

}

6.    事件流

子元素的事件被触发时，父级也会被触发（冒泡）

一个完整事件流包含  捕获阶段 ---> 目标阶段  --->冒泡阶段

事件流：事件执行的顺序

7.    冒泡是可以阻止的

     e . stopPropagation( );

     e . cancelBubble=true;//兼容IE

8.    事件监听

DOM0级事件处理，是一种赋值方式，是被所有浏览器所支持的，简单易懂容易操作；

DOM2级事件处理是所有DOM节点中的方法，可以重复绑定，但是浏览器兼容存在问题；

if(window.attachEvent){

    oDiv.attachEvent("onclick", function(){ ... });  // IE只有冒泡阶段,所以没有第三个参数，而且需要加on；

}else{

    oDiv.addEventListener( "click", function(){ ... },false);  // false指冒泡阶段

}

//移除事件监听，第二个参数为必须，移除的事件处理函数

    oDiv.removeEventListener( "click",fn）

    oDiv.detachEvent("onclick",fn)

9.    判断事件源：

    e.target || e.srcElement