（笔记）鼠标移动到一个 元素上所触发的事件

 

//当鼠标开始移动到按钮上 一直到移除会依次出发 mouseover ->mousemove ->mouseout

//如果移动到按钮上面再点击一下在移出按钮范围的话，事件触发顺序为 mouseover->mousemove->mousedown(可能会有mousemove)->mouseup->click->mousemove->mouseout

//mousemove事件是mouse鼠标只要在按钮上面移动，就会触发的事件。所以在上面的过程中，就算是鼠标按下了之后有鼠标的移动也会触发mousemove

//一般点击的事件都是从鼠标按下又抬起之后才开始算的，也就是click事件触发时。

有双击的事件时如下图

 

 

 

html中指定事件处理程序 有两个缺点首先，存在一个时差问题。因为用户可能会在 HTML 元素一出现在页面上就触发相应的事件，但当时的事件处理程序有可能尚不具备执行条件，另一个缺点是，这样扩展事件处理程序的作用域链在不同浏览器中会导致不同结果。不同 JavaScript 引擎遵循的标识符解析规则略有差异，很可能会在访问非限定对象成员时出错。

//DOM0级事件处理程序

//通过 JavaScript 指定事件处理程序的传统方式，就是将一个函数赋值给一个事件处理程序属性。这 种为事件处理程序赋值的方法是在第四代 Web 浏览器中出现的，而且至今仍然为所有现代浏览器所支 持。原因一是简单，二是具有跨浏览器的优势。要使用 JavaScript 指定事件处理程序，首先必须取得一 个要操作的对象的引用。

//使用 DOM0 级方法指定的事件处理程序被认为是元素的方法。因此，这时候的事件处理程序是在 元素的作用域中运行；换句话说，程序中的 this 引用当前元素。来看一个例子。 var btn = document.getElementById("myBtn"); btn.onclick = function(){ alert(this.id); //"myBtn" };

 

DOM2级事件处理程序

//“ DOM2 级事件” 定义了两个方法，用于处理指定和删除事件处理程序的操作： addEventListener() 和 removeEventListener()。所有 DOM 节点中都包含这两个方法，并且它们都接受 3 个参数：要处 理的事件名、作为事件处理程序的函数和一个布尔值。最后这个布尔值参数如果是 true，表示在捕获 阶段调用事件处理程序；如果是 false，表示在冒泡阶段调用事件处理程序。

 

//通过 addEventListener()添加的事件处理程序只能使用 removeEventListener()来移除；移 除时传入的参数与添加处理程序时使用的参数相同。这也意味着通过 addEventListener()添加的匿 名函数将无法移除，(两次调用的匿名函数不是相同的函数)如下面的例子所示。
//IE 实现了与 DOM 中类似的两个方法： attachEvent()和 detachEvent()。这两个方法接受相同 的两个参数：事件处理程序名称与事件处理程序函数。由于 IE8 及更早版本只支持事件冒泡，所以通过 attachEvent()添加的事件处理程序都会被添加到冒泡阶段。

 

 

 

 

//