事件对象 | Asuhe = Born in poverty, died of numbness

# 什么是事件对象

在浏览器中我们通常都是通过事件触发来实现网页与用户的交互效果的，在这个过程中 js 会产生一个事件对象。例如我们用常规方法给按钮绑定一个点击事件

	<button>按钮</button>

	<script>
	var btn = document.querySelector('btn');
	btn.addEventListiner('click',function( e ){ // 这里我们给匿名函数的形参 e 就可以接收到 click 产生的事件对象
	alert('哈喽');
	})
	</script>

在返回的事件对象中包含了很多属性与方法，这些属性可以让我们准确的获取到用户目前的状态，例如用户按下了什么键、鼠标移动坐标、鼠标点击等等。然后我们可以根据用户的状态去设计我们的交互。我们可以打印一下这个对象看看里面都有什么

部分事件对象的内容

一个事件从产生到被触发可以分为三个阶段：捕获阶段、停留阶段、冒泡阶段。在捕获阶段，浏览器查找触发的事件顺序是从顶级 DOM 依次查找，直到找到源头。如果查找过程中有 DOM 元素绑定了和事件源头一样的事件，则会被触发。举个例子

	<div class='father'>
	<div class='son'>Asuhe</div>
	</div>

	<script>
	var father = document.querySelector('.father');
	father.addEventListiner('click',function(){
	alert('我是你爸爸');
	},true) // 开启捕获阶段

	var son = document.querySelector('.son');
	son.addEventListiner('click',function(){
	alert('我是你儿子');
	})
	</script>