事件对象

在触发DOM上的某个事件时，会产生一个事件对象event,这个对象中包含着所有与事件有关的信息。包括导致事件的元素、事件的类型以及其他与特定事件相关的信息。

event对象包含与创建它的特定事件有关的属性和方法，触发的事件类型不一样，可用的实行和方法也不一样。

                                  属性/方法          类型          读/写                              说明

                           currentTarget        Element       只读        其事件处理程序当前正在处理事件的那个元素

                           target                   Element       只读        事件的目标

在事件处理程序的内部，对象this始终等于currentTarget的值，而target则只包含事件的实际目标。而target则只包含事件的实际目标。如果直接将事件处理程序指定给了目标元素，则this、currentTarget和target包含相同的值。来看下面的例子：

var btn=document.getElementsById("myBtn");
btn.onclick=function(event){
         alert(event.currentTarget===this)  ;   //true
         alert(event.target===this);   //true

}

这个例子检测了currentTarget和target与this的值。由于click事件的目标是按钮，因此这三个值是相等的。如果事件处理程序存在于按钮的父节点（此处，按钮的父节点便是body）中，那么这些值是不相同的。再看下面的例子。

document.body.onclick=function(event){
         alert(event.currentTarget===document.body);   //true
         alert(this===document.body);   //true
        alert(event.target===document.getElementsById("myBtn")); //true
}

当单击这个例子中的按钮时，this和currentTarget都等于document.body,以为事件处理程序时注册到这个元素上的。然而，target元素却等于按钮元素，因为他是click事件真正的目标。由于按钮上并没有注册事件处理程序，结果click事件就被冒泡到document.body，在那里事件才得到了处理。

关于这里的理解可以举二个例子说明：
一、当点击"mybtn"按钮时，会输出true   true  true true true;  自己本身单击会输出两个true然后冒泡到父元素又会输出三个true;

二、当点击"mybtn"按钮的父元素除去其之外的任意一处都会输出 true  true  false;