HTML DOM 事件

事件监听

• 事件监听第一种方法

例如：

var oBtn = document.getElementById('btn');
oBtn.onclick = function () {}

• 事件监听第二种(官方)方法

语法：

 element.addEventListener(event, function, useCapture);

注1：
第一个参数是事件的类型 (如 "click" 或 "mousedown").
第二个参数是事件触发后调用的函数。
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。

注2：
addEventListener() 方法允许向同个元素添加多个事件，且不会覆盖已存在的事件。

例如：

var oBtn = document.getElementById('btn');
oBtn.addEventListener('click',fn1);
function fn1() {
	alert(123)
}

• removeEventListener() 方法

removeEventListener() 方法移除由 addEventListener() 方法添加的事件句柄。

element.removeEventListener("mousemove", myFunction);

鼠标事件

• click ----------------鼠标单击事件
• dblclick-------------鼠标双击事件
• contextmenu------右键菜单事件
• mouseover--------鼠标悬浮事件
• mouseout----------鼠标移走事件
• mousedown-------鼠标按下事件
• mouseup----------鼠标释放事件
• mousemove-------鼠标移动事件

键盘事件

• keydown------键盘按下事件
• keyup--------键盘松开事件
• keypress-----键盘按下事件

注：keydown与onkeypress区别： keypress把自己定位为高级事件 能够显示特殊的符号

文档事件

• load--------事件直到文档和所有图片加载完毕时才会触发
• unload-------事件在窗口关闭或者document对象将要卸载时触发，发生在window、body、frameset等对象上面。它的触发顺序排在beforeunload、pagehide事件后面。unload事件只在页面没有被浏览器缓存时才会触发，换言之，如果通过按下“前进/后退”导致页面卸载，并不会触发unload事件。
• beforeunload----事件在即将离开当前页面（刷新或关闭）时触发。

表单事件

• submit------表单提交事件
• reset-------表单提交事件
• blur--------表单失去焦点事件
• focus-------表单获得焦点事件
• change------表单改变事件

图片事件

• abort------图片终止加载时触发
• load-------图片加载事件
• error------图片加载失败事件