事件对象
每个元素身上的事件都是天生自带的，不需要定义，只需要我们给这个事件绑定一个方法，当事件触发的时候就会执行这个方法
事件绑定的写法：
1---div.onclick=function(){} （dom零级事件绑定）
2---div.addeventlistener() （dom二级事件绑定）
div.attachevent()
二者区别：
onclick是这个元素的私有属性，天生自带的；
addeventlistener，attachevent是公有的
div.onclick存在事件冒泡机制，没有捕获机制
div.addeventlistener()有冒泡有捕获 div.attachevent()只有冒泡
arguments：
每个函数都有一个arguments对象，他是这个函数所有参数构成的集合；
arguments数组中有一个元素叫mouseevent，所有，每个事件的方法中浏览器都给他一个参数叫mouseevent
我们所有鼠标的信息都临时存储在这个mouseevent对象上
event对象的兼容性：
clientX clientY鼠标到浏览器窗口左上角的距离坐标
pageX pageY 鼠标到网页左上角的距离坐标；IE低版本没有这个属性
IE下算pageX值：clientX+scrollwidth clientY+scrolltop
事件源：
点击那个元素那个元素就是事件源
var target=ev.target||ev.srcelement
阻止事件冒泡：
ev.stoppropagation?ev.stoppropagation():ev.cancelbubble=true
阻止事件默认行为：
ev.preventdefault?ev.preventdafault():ev.returnvalue=false
事件委托：
如果子元素身上绑定大量相同的事件，我们尽量采用事件委托，把所有子元素的事件委托给父级
为什么采用事件委托？
传统的for循环绑定事件，会增加大量的dom操作（事件），影响页面性能，采用事件委托就是把所有的事件都基于一个元素身上
原理：
采用事件冒泡机制完成的
事件委托和传统饿事件绑定的优势：
传统的事件委托对新增的元素不起作用；事件委托起作用；
并不是所有的事件都存在事件冒泡：
onmouseenter；onmouseleave没有事件冒泡机制
传统的事件绑定，有多少元素js就需要绑定多少个；事件委托只需要一个事件；
dom零级事件元素绑定多个click，最后只执行最后一个click（会覆盖）
dom二级事件元素绑定多个click，都要执行；
div.addeventlistener("click" ,fn1,false)
div.addeventlistener("click" ,fn1,false)
注意：当绑定多个事件名，事件发生阶段，函数名，三者完全一样的时候，才执行最后一个
区别：
dom零级绑定多个相同的事件，后者会覆盖前者；dom二级不会
dom零级只适合普通事件，
dom二级患有指定的事件类型（如domcontentloaded--当HTML文档结构加载完成之后执行，这个事件就是jQuery中$（document）.ready()）
事件取消：
dom零级：div.onclick=null
dom二级：div.removeeventlistener（“click” ，fn1，false）
键盘事件：
事件：onkeydown，onkeyup
键盘触发事件时，浏览器天生给一个方法叫keyboardevent的对象，所有键盘的信息都在这个对象上
event有个属性可以keycode，键盘编码
document.onkeydown=function(ev){
var ev=ev||window.event
console.log(ev.keycode)
}
右击鼠标事件：
oncontextmenu