事件处理程序

什么事事件对象呢？在触发DOM上的事件时都会产生一个对象事件对象event

Event对象在event第一次触发的时候被创建出来，并且一直伴随着事件在DOM结构中流转的整个生命周期。event对象会被作为第一个参数传递给事件监听的回调函数。我们可以通过这个event对象来获取到大量当前事件相关的信息

• type (String) — 事件的名称
• target (node) — 事件起源的DOM节点
• currentTarget?(node) — 当前回调函数被触发的DOM节点（后面会做比较详细的介绍）
• bubbles (boolean) — 指明这个事件是否是一个冒泡事件（接下来会做解释）
• preventDefault(function) — 这个方法将阻止浏览器中用户代理对当前事件的相关默认行为被触发。比如阻止标签a元素的click事件加载一个新的页面
• stopPropagation (function) — 这个方法将阻止当前事件链上后面的元素的回调函数被触发，当前节点上针对此事件的其他回调函数依然会被触发。（我们稍后会详细介绍。）
• stopImmediatePropagation (function) — 这个方法将阻止当前事件链上所有的回调函数被触发，也包括当前节点上针对此事件已绑定的其他回调函数。
• cancelable (boolean) — 这个变量指明这个事件的默认行为是否可以通过调用event.preventDefault来阻止。也就是说，只有cancelable为true的时候，调用event.preventDefault才能生效。
• defaultPrevented (boolean) — 这个状态变量表明当前事件对象的preventDefault方法是否被调用过
• isTrusted (boolean) — 如果一个事件是由设备本身（如浏览器）触发的，而不是通过JavaScript模拟合成的，那个这个事件被称为可信任的(trusted)
• eventPhase (number) — 这个数字变量表示当前这个事件所处的阶段(phase):none(0), capture(1),target(2),bubbling(3)。我们会在下一个部分介绍事件的各个阶段
• timestamp (number) — 事件发生的时间

此外事件对象还可能拥有很多其他的属性，但是他们都是针对特定的event的。比如，鼠标事件包含clientX和clientY属性来表明鼠标在当前视窗的位置。

我们可以使用熟悉的浏览器的调试工具或者通过console.log在控制台输出来更具体地查看事件对象以及它的属性。

a标签默认有跳转行为，可以通过 preventDefaut来阻止，尤其在移动端用的比较多，不希跳转而是调到某个位置,另外bubbles属性canselable属性可以了解一下。

//怎么来获取一个兼容所有浏览器的一个事件对象
getEvent:function(event){
    return event?event:window.event;
},
//获取事件类型
getType:function(event){
    return event.type;
},
//获取事件来自于哪个元素
getElement:function(event){
    return event.target || event.srcElement;
},
//不同浏览器   怎么阻止事件的默认行为
preventDefault:function(event){
    if(event.preventDefault){
        event.preventDefault();
    }else{
        event.returnValue=false; //IE
    }
},
//不同浏览器   怎么阻止事件冒泡
stopPropagation:function(event){
    if(event.stopPropagation){
        event.stopPropagation();
    }else{
        event.cancelBubble=true; //IE
    }
}

相关文章:
1.理解事件流
2.使用事件处理程序
3.Event对象