theme: channing-cyan
这是我参与8月更文挑战的第27天，活动详情查看：8月更文挑战
什么是事件对象
事件对象其实就是event对象，在我们操作DOM发生事件时，所有的相关信息都会被集中存储在这个event对象中，这个对象中包含了被发生事件的元素，发生事件的类型以及可能与特点事件相关的其他数据，所有浏览器都支持这个event对象，但是ie的访问方式略有不同，我们稍后细说，往下观看。
DOM事件对象
event对象是传给事件处理程序的唯一参数，我们输出一下它看看里面都有什么。
代码语言：javascript复制<body>
<button>点我输出event</button>
</body>
<script>
let btn = document.querySelector('button');
btn.onclick = function(event) {
console.log(event);
}
</script>
因为太长了这里缩小了一点。大家可以也尝试输出一下看看都有什么。里面挺多东西的，但一般我们用到的就那么几个。
target 表示目标事件
eventPhase 表示事件处理程序阶段，1代表捕获，2代表达到目标，3代表冒泡
type 被触发的事件类型
detail 事件相关的其他信息
currentTarget 当前事件处理程序所在的元素
有时候我们读别人代码的时候别人可能就写了一个e代替event，这样也是可以跑的，我们可以传任何名称，都可以跑，一般我建议写event，因为本来就是这样定义的，还增加可读性。
我们说一下this指向问题
在事件处理程序内部，this对象始终等于currentTarget的值。 我们输出一下看看
代码语言：javascript复制 let btn = document.querySelector('button');
btn.onclick = function(event) {
console.log(event);
console.log(this);
console.log(event.currentTarget);
}
注意：event对象值在事件处理执行期间存在，一旦执行完毕后自动销毁。
IE事件对象
前面提到过ie的访问方式不同，在ie中event对象可能是window对象中的一个属性。 写一下
代码语言：javascript复制btn.onclick = function(){
let event = window.event;
console.log(event);
}这里就是window.event保存着event对象，只做一下了解吧，毕竟都2021年了，IE马上要退出历史舞台了。
