事件和事件处理

事件类型

也就是事件名称，以字符串的形式存在，用于指定要发生哪种事件。
表单事件：focus、blur、sumbit、change等
鼠标事件：mouseover、mouseup、mousemove、mousedown、click、dbclick等
键盘事件：keydown、keyup、keypress等
触屏事件：touchstart、dragenter、dragend等
拖放事件dragstart、dragenter、dragend等
文档加载事件：load、DOMContentLoaded等
窗口事件：resize、scroll、load、unload等

事件目标

是发生的事件和与之相关的对象。事件目标就是注册了某个事件的对象，如果要执行事件，就必须指定事件类型和事件目标。在JavaScript中，最常用的事件目标就是Window、Document和Element。
事件处理程序
事件处理程序就是用户或浏览器自身执行的某种动作。例如click、load等，都是事件的名称，而响应某个事件的函数就叫做事件处理程序（或事件侦听器）。事件处理程序的名字以"on"开头，因此click事件的时间处理程序就是onclick，load事件的时间处理程序就是onload。

为事件指定处理程序的方式或注册事件（绑定事件）的方式：
1) 设置JavaScript对象属性为事件处理程序
通过设置事件目标的属性为所需事件处理程序函数。

window.onload=function(){
var elt=document.getElementById("shiping_adress");
elt.onsubmit=function(){return "addf"}; 
}

在这种方式中的事件处理程序允许使用作用域链的快捷方式，也就是在调用对象的方法时，不用显式地将对象写出来。

<button type="button" onclick="console.log(type)">btn</button>

如果想阻止事件的默认行为操作，只要将事件处理程序的返回值设为false即可。

<button type="button" onclick="return false;">btn</button>

这种注册方式实现起来很简单，但是有很大的局限性。首先不能控制注册事件的时机，也就是说某些事件需要满足一些条件后才能注册，而这种方式只要文档渲染好后，执行某个动作（如点击按钮）就能触发对应的事件，其次，HTML和JavaScript代码紧密耦合，冗长的代码串即不利于维护，也不符合结构与行为分离的规则。
2）HTML事件处理程序

当在HTML属性中注册事件处理程序时，不能包含函数声明，也就是不能包含大括号和function关键字，只能是函数调用或具体的代码块：

<button type="button" onclick="console.log("onclick")">提交</button>
<!--不能下面的函数声明-->
<button type="button" onclick="function(event){}">提交</button>

此时的this会根据不同的情况，指向不同的对象。如果是在事件处理程序中执行代码块，那么此时指向的是当前元素对象；如果是在事件处理程序中调用函数，那么此时指向的是全局对象。

<button type="button" onclick="showThis()">btn</button>
<script>
	function showThis(){
		console.log(this);//window
	}
</script>

3）addEventListener()
除IE8及以下版本外，所有的浏览器都支持addEventListener()方法。此方法由事件目标调用，能接受三个参数，第一个是事件类型（不包含前缀“on”），第二个参数是事件处理程序，第三个参数是一个布尔值，表示捕获（true）还是冒泡（false）。

var  myBtn=document.getElementById("btn");
myBtn.addEventListener("click",function(){
	console.log(this);
},false);

4)attachEvent()
IE实现了与DOM中两个类似的方法：attachEvent()和detachEvent(),这两个方法接收相同的两个参数：事件处理程序名称与事件处理程序函数。由于IE8及更早的版本只能支持事件冒泡，所以通过attachEvent()添加的事件处理程序就会被添加到冒泡阶段。事件处理程序会在全局作用域中执行，此时的this会指向全局对象。

var  myBtn=document.getElementById("btn");
myBtn.attachEvent("onclick",function(){
	console.log(this);//window
});

事件对象

在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。包括导致事件的元素、事件的类型以及其他与特定事件相关的信息。例如，鼠标操作导致的事件对象中，包含鼠标为位置的信息，而键盘操作导致的事件对象中，会包含与按下的键有关的信息。所有的浏览器都支持event对象，但支持方式不同。
事件传播
是浏览器决定哪个对象触发其事件处理程序的过程。对于单个对象的特定事件（如Window对象的onload事件),必须是不能传播的。