-
1.事件冒泡：事件由子元素获取并沿DOM树向上传播 2.事件捕获：事件由根元素获取并沿DOM树向下分发查看全部
-
本章内容 1、理解事件流 2、使用事件处理程序 3、不同的事件类型 一、事件流 事件是文档或浏览器窗口中发生的特定的交互瞬间。【JavaScript <------>HTML】 事件流：描述的是从页面中接受事件的顺序 （IE：事件冒泡流 / Netscape事件捕获流） 事件冒泡流：即事件最开始由最具体的无素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到最不具体的那个节点（文档） input----->document 事件流描述的是从页面中接受事件的顺序。 IE的事件流是事件冒泡流，而Netscape的事件流是事件捕获流 1、事件冒泡 事件冒泡，即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收，然后逐级向上转播至最不具体的节点(文档)。 2、事件捕获 事件捕获的思想是不太具体的节点应该更早接收到事件，而最具体的节点最后接收到事件。 二、事件处理程序 1、HTML事件处理程序 2、DOM0级事件处理程序 3、DOM2级事件处理程序 DOM2级事件定义了两个方法：用于处理指定和删除事件处理程序的操作：addEventListener()和removeEventListener()。它们都接收三个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。 4、IE事件处理程序 attachEvent()添加事件 detachEvent()删除事件 这两个方法接收相同的两个参数：事件处理程序名称与事件处理函数 5、跨浏览器的事件处理程序 三、事件对象 事件对象event 1、DOM中的事件对象 (1)、type:获取事件类型 (2)、target：事件目标 (3)、stopPropagation() 阻止事件冒泡 (4)、preventDefault() 阻止事件的默认行为 2、IE中的事件对象 (1)、type:获取事件类型 (2)、srcElement：事件目标 (3)、cancelBubble=true阻止事件冒泡 (4)、returnValue=false阻止事件的默认行为查看全部
-
IE8以前的浏览器只支持事件冒泡，不支持事件捕获，它也不支持addEventListener函数，不会用第三个参数来表示是冒泡还是捕获，它提供了另一个函数attachEvent。IE9就支持addEventListener（这段是借鉴其他问题别的同学的回答）。 addEventListener()的第三个参数useCapture，这个参数决定要使用的事件处理程序的调用类型，只有在特定狀況下才会对事件产生影响，通常建议用false； 如果参数是true，事件处理程序以捕捉模式触发；从顶层的父节点开始触发事件，从外到内传播。 如果参数是false，事件处理程序以冒泡模式触发；从最内层的节点开始触发事件，逐级冒泡直到顶层节点，从内向外传播。查看全部
-
1、DOM0级和DOM2级的共同优点： 能添加多个事件处理程序，按顺序执行，HTML事件处理程序无法做到~ 2、关于dom0级和dom2级的区别 DOM0级事件处理：同时绑定几个不同的事件，例如在绑定onclick的基础上再绑定一个onmouseover为按钮2设置背景颜色（这里注意不能onclick、onmouseover事件都设为alert弹出哦，可能有冲突，dom0和dom2都不能成功）；但是不能同时绑定多个相同的事件，比如onclick；会覆盖，只会执行最后一个的函数； DOM2级事件处理：优点：同时绑定几个事件（相同或不同），然后顺序执行，不会覆盖。缺点：不具有跨浏览器优势。查看全部
-
DOM事件对象查看全部
-
IE事件处理程序 attachEvent()添加事件 detachEvent()删除事件 接受相同的两个参数：事件处理程序的名称和事件处理程序的函数 不使用第三个参数：IE8以及更早的浏览器版本只支持事件冒泡 例子： btn.attachEvent('onclick',showMes); btn.detachEvent('onclick',showMes);//事件不用去除on 注：element.onclick===element['onclick'];查看全部
-
DOM2级事件处理程序 两个方法：用于处理指定和删除事件处理程序的 ——addEventListener()和removeEventListener() 接受三个参数：要处理的事件名，作为事件处理程序的函数和布尔值（默认flase事件冒泡） 例子：btn.addEventListener('click',showMes,false);//事件名前面的on要去掉 btn.removeEventListener('click',showMes,false);//参数要求和添加方法一样 注：共同优点：DOM0和DOM2都可以同时添加多个事件，都是顺序执行 不同点： DOM0同时绑定几个不同的事件 | DOM2同时绑定几个事件（相同或不同）； DOM2无法跨浏览器，IE9可以兼容DOM2。 this可以引用html元素（引用btn）。查看全部
-
DOM0级事件处理程序 传统方式：把一个函数赋值给一个事件的处理程序属性 var btn=document.getElementById('btn'); btn.onclick=function(){ alert('这是通过DOM0级添加的事件'); } btn.onclick=null;//删除DOM0事件查看全部
-
HTML事件处理程序 onclick="alert('hello')"查看全部
-
事件对象查看全部
-
element.onclick===element["onclick"]查看全部
-
ie事件处理程序 attachEvent()添加事件 detachEvent()删除事件查看全部
-
通过addEventListener添加的事件只能通过removeEventListener移除查看全部
-
跨浏览器事件对象查看全部
-
function 方法名（event）{ event = event || window.event; var ele = event.target || event.srcElement; alert(ele); } }查看全部
举报
0/150
提交
取消