DOM事件处理
来源:互联网 发布:java spring 切面编程 编辑:程序博客网 时间:2024/05/16 03:59
一、事件流
事件流描述的是从页面中接受事件的顺序。
IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流
1、事件冒泡
事件冒泡,即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上转播至最不具体的节点(文档)。
2、事件捕获
事件捕获的思想是不太具体的节点应该更早接收到事件,而最具体的节点最后接收到事件。
二、事件处理程序
1、HTML事件处理程序
<input type="button" value="按钮" id="btn" onclick="showMes()">
2、DOM0级事件处理程序
btn.onclick=function(){};
3、DOM2级事件处理程序
DOM2级事件定义了两个方法:用于处理指定和删除事件处理程序的操作:addEventListener()和removeEventListener()。它们都接收三个参数:要处理的事件名、作为事件处理程序的函数和一个布尔值。
element.addEventListener("click",function,false);
type:不加on
4、IE事件处理程序
attachEvent()添加事件
detachEvent()删除事件
这两个方法接收相同的两个参数:事件处理程序名称与事件处理函数
element.attachEvent('onclick',function);
5、跨浏览器的事件处理程序
// 添加句柄 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); }else if(element.attachEvent){ element.attachEvent('on'+type,handler); }else{ element['on'+type]=handler; } }, // 删除句柄 removeHandler:function(element,type,handler){ if(element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } },
三、事件对象
事件对象event
1、DOM中的事件对象
(1)、type:获取事件类型
(2)、target:事件目标
(3)、stopPropagation() 阻止事件冒泡
(4)、preventDefault() 阻止事件的默认行为
2、IE中的事件对象
(1)、type:获取事件类型
(2)、srcElement:事件目标
(3)、cancelBubble=true阻止事件冒泡
(4)、returnValue=false阻止事件的默认行为
getEvent:function(event){ return event?event:window.event; }, getType:function(event){ return event.type; }, getElement:function(event){ return event.target || event.srcElement; }, preventDefault:function(event){ if(event.preventDefault){ event.preventDefault(); }else{ event.returnValue=false; } }, stopPropagation:function(event){ if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble=true; } }
0 0
- Dom 事件处理函数
- DOM 中的事件处理
- DOM事件的处理
- DOM事件处理
- DOM事件处理
- DOM事件处理
- DOM事件处理程序
- Dom事件处理程序
- DOM事件处理程序
- DOM事件的处理
- DOM事件处理程序
- DOM事件处理程序
- DOM事件处理程序
- DOM事件处理方式
- Javascript处理DOM元素事件
- 使用 Dojo 处理 DOM 事件
- JS DOM事件处理程序
- DOM事件处理程序总结
- ubuntu 的使用(四)—— apt-get 与 dpkg
- 几种常见浏览器内核简介
- 桌面和文件夹右击windows资源管理器停止工作重启解决方法
- 我的博客 第一天
- 虚拟机VMwareWorkstation的安装
- DOM事件处理
- PTA 11-散列2 Hashing (25分)
- Android开发中,怎样调用摄像机拍照以及怎样从本地图库中选取照片
- Linux下用vim编写程序
- LEAPMOTION开发UI专题(2)
- iOS 之控制器view显示中view的父子关系及controller的父子关系_解决屏幕旋转不能传递事件问题
- 沙盒文件管理
- Visual Assist 最有用的快捷键
- 520 | 用c语言程序撩妹