web前端-DOM-事件高级

一、注册事件

一、传统的注册方式：

1.利用on开头 onclick
2.特点：注册事件的唯一性，后注册的处理函数会覆盖前面的处理函数

二、addEventListener 支持IE9以上的版本（标准）

用法： eventTarget.addEventListener(type, listener[,useCapture])
eventTarget是目标对象
type是类型，字符串，记住带上“ ”

三、attachEvent()支持IE9一下的版本（非标准）

二、删除事件

1. 传统方法：目标对象.οnclick=null;
2. 方法监听注册方式：eventTarget.addEventListener(type, listener[,useCapture])
   

三、事件对象

主要是在监听函数的小括号里面，当做形参来看

1. 兼容性写法：e=e||window.event; event就是这个事件对象
2. 事件对象常见的属性和方法

对象属性	相关说明
e.Target	返回触发事件的对象（标准）
e.srcElement	返回触发事件的对象（非标准 ）
e.type	返回事件的类型，不带on
e.preventDefault	阻止默认行为事件，不让链接跳转/不让按钮提交
e.returnValue	（非标准）

阻止冒泡事件

1. e.stopPropagation(); 标准
2. e.cancelBubble = true/false; 非标准

四、事件委托

原理：不是对每一个子节点都单独设置事件监听器，而是在事件监听器设置在父节点上，然后利用冒泡原理影响设置的每一个节点

五、常见的鼠标事件

1. 禁止鼠标右键菜单 contextmenu
   document.addEventListener(“contextmenu”, function(e) {
   e.preventDefault(); })
2. 禁止鼠标选中 selectstart
   document.addEventListener(“selectstart”, function(e) {
   e.preventDefault(); })

鼠标对象事件MouseEvent

六、常用的键盘事件

属性	说明
onkeydown	按键被按下时触发
onkeyup	按键被松开时触发
onkeypress	按键被松开时触发，但是他不识别功能键

执行顺序分别是：onkeydown —onkeypress—onkeyup

键盘事件对象

e.keyCode 可根据返回的Ascll码值判断用户的按键

onkeypress的e.keyCode是可以区分大小写的