JS--事件对象

在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。

DOM中的事件对象

兼容DOM的浏览器会将一个event对象传入到事件处理程序中，无论指定事件处理程序时是DOM0级事件还是DOM2级事件，都会传入event对象。

var btn = document.getElementById('btn')
btn.onclick = function(event){
  console.log(event.type) //'click'
}

btn.addEventListener('click', function(event){
  console.log(event.type)  // 'click'
},false)

event对象包含与创建它的特定的事件有关的属性和方法，触发的事件类类型不一样，可以使用的事件对象上的属性和方法也不一样。不过所有事件都会有一下列出的成员“

属性/方法	类型	读写	说明
bubbles	boolean	只读	表明事件是否冒泡
cancleable	boolean	只读	表明是否可以取消事件的默认行为
currentTarget	Element	只读	表明事件处理程序当前正在处理事件的那个元素
defaultPrevented	boolean	只读	为true表明调用了preventDefault()（DOM3级事件新增）
detail	Integer	只读	表明与事件相关的细节信息
eventPhase	Integer	只读	调用事件处理程序的阶段：1、捕获阶段；2、处于目标阶段；3、冒泡阶段
preventDefault()	Function	只读	取消事件的默认行为，如果cancelable 为true，则可以使用该方法
stopImmediatePropagation()	Function	只读	取消事件的进一步捕获或冒泡，同时阻止任何事件处理程序被调用(DOM3级新增)
stopPropagation()	Function	只读	取消事件的进一步捕获或冒泡，如果bubbles为true的话可以使用这个方法
target	Element	只读	事件的目标，currentTarge表示当前的事件阶段的目标
type	String	只读	事件触发的类型
view	AbstractView	只读	与事件有关联的抽象视图，等同于发生事件的window对象

在事件处理程序内部，对象this始终等同于currentTarget的值，而target则是包含事件的实际目标，如果将事件处理程序制定给了目标元素，则this，currentTarge，target包含的是相同的值。

注意：当事件处理程序执行完后，事件对象会被销毁。

• IE中的事件对象
  在IE中访问事件对象的几种不同方式，取决于绑定事件处理程序的方式。在DOM0级方法添加事件处理程序时，event对象作为window对象的属性存在。

var btn = document.getElementById('btn')

btn.onclick = function() {
  var event  = window.event
  console.log(event.type)
}

如果事件处理程序是使用attachEvent()方法添加的没那么就会有一个event对象作为参数传到事件处理程序的函数参数列表中。

var btn = document.getElementById('btn')

btn.attachEvent('click', function(event){
  console.log(event.type)
}, false)

在IE的所有事件对象都会包含以下属性和方法：

属性/方法	类型	读写	说明
cancelBubble	boolean	读写	默认值为false，但将其设置为true可以取消事件冒泡，和stopPropagation()一样
returnValue	boolean	读写	默认为true，设置为false就可以取消事件的默认行为，和preventDefault()作用一样
scrElement	Element	只读	事件目标，和target一样
type	string	只读	表示触发的事件类型