事件：元素天生具备的行为，当我们去操作元素的时候，元素的相关事件就会被触发
pc端：
click：点击事件，dbclick：双击
keydown：键盘按下；keypress：键盘长按（600ms）；keyup：键盘抬起，
scroll：滚动，load：页面资源文件加载完成，error：加载失败，resize：窗口大小，
focus：获取焦点，blur：失去焦点，
mouseove：r鼠标划入，mouseout：鼠标划出；mouseenter：鼠标进入， mouseleave：目标离开，mousemove，mousedown：鼠标按下，mouseup：抬起，mousewheel：鼠标滚轮滚动
移动端：
手指事件：
click事件也能在移动端使用，但是有300秒延迟触发事件，
因为在这个时间段是否触发了第二次事件，如果触发了click没触发，dbclick触发了，
移动端的click是单机事件不是点击事件
单手指操作事件：
touchstart：手指按到屏幕上
toucumove：手指在屏幕上移动
touchend：手指离开屏幕；
touchcancel：手指操作取消；
多手指操作事件：
gesturestart：多手指按下
gesturechange：多手指改变位置
gestureend：多手指离开
移动端键盘
keyup，keydown，keypress等键盘事件，大部分手机都不兼容，
如果需要监听表单内容的改变，我们需要使用input事件；
新版es标准增加（兼容性不好）
dragstrat：拖拽开始
drag：拖拽中
dragend：结束
事件触发执行函数，不但函数执行，还给函数传递了一个实参，接受当前点击行为触发执行的时候，我们浏览器传递的这个实参称之为事件对象；
函数执行，传递的这个实参，（e）我们叫做事件对象；
事件对象：
标准浏览器：mouseEvent； ie浏览器：PointerEvent
e = e || window.event
target = target || srcElement
'preventDefault' in e ?e.preventDefault() :returnValue = false
stopPropagation in e ? e.stopPropagation（） : cancelBubble = true
clientX，clientY：当前鼠标距离屏幕的距离；兼容所有浏览器
pageX，pageY：当前鼠标距离body浏览器第一屏的x，y坐标，分页的x，y距离；
clientX + 浏览器的scrollTop
(document.documentElement.scrollTop || document.body.scrollTop)
e.preventDefault() 阻止当前元素的默认行为，元素天生自带的行为；
input的默认行为，当在文本框输入内容的时候，内容填入文本框中，
a的默认行为跳转行为；
e.stopPropagation () 阻止冒泡；
document.body.onclick = function (e) {
//兼容ie6-8兼容模式,自定义兼容模式
if (typeof e == 'undefined') {
e = window.event;
e.target = e.srcElement
e.pageY = e.clientY+ (document.documentElement.scrollTop || document.body.scrollTop)
e.pageX = e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)
e.preventDefault = function () {
e.returnValue = false
}
e.stopPropagation = function () {
e.cancelBubble = true
}
}
e.target;
e.stopPropagation()
}
键盘事件对象
keyboardEvent
e.keycode = e.keycode || e.which
keycode：键盘code
which：当前按键的键盘码
常用的键盘码：
空格键：32
enter：13
backpace：8
delete：46；
事件传播
捕获，目标，冒泡
三种阶段
1.先捕获，从window 到目标元素，2，触发目标元素事件，3向上冒泡，只要绑定事件都会触发，没有绑定事件不会触发；
这种方式是DOM0级事件，这种行为的绑定方法，事件只会在冒泡的时候才会执行，和捕获没有任何关系；
在这三种阶段中，我们的冒泡使用比较多，捕获阶段基本不用；
冒泡传播
当前元素的某个事件行为被触发，起祖先元素的相关事件行为都会被触发，这种机制
e.stopproPropagation 阻止默认行为；
那些事件行为没有传播机制
onload，onerror，onscroll，focus，blur
change，key系列存在传播机制；鼠标事件也存在传播机制；
mouseover的两个特点：
1.存在事件冒泡传播；
2.从父元素进入子元素，触发子元素的over事件，父元素的over事件，传播机制；
3.从子元素进入父元素，触发父元素的over事件，因为又一次滑入父元素，所以触发了over事件；
mouseout：
1.进入子元素，父元素触发mouseout事件，
2.从子元素离开，利用传播机制，子元素和父元素都触发了mouseout事件；
mouseenter：
1.没有传播机制；默认阻止了冒泡传播机制；
2.从父元素进入子元素，触发子元素的mouseenter事件，不会触发父元素的事件，因为没有传播机制；
2.从子元素进入父元素中不会触发父元素事件，因为子元素进入父元素都是在父元素元素中欧，没有离开，一直在元素本身中；
mouseleave：
1.从父元素离开进入子元素，不会触发父元素的leave事件，
2，从子元素离开到父元素，会触发子元素的leave事件，我们始终没有离开父元素，所以父元素的leave事件不会触发；