高级事件.

本文详细介绍了JavaScript中的高级事件处理,包括事件监听注册、removeEventListener的使用、DOM事件流、事件对象方法、阻止默认行为、事件委托以及鼠标和键盘事件的特性和实例。


其他
禁用 this.disabled=true
阻止链接跳转herf=javaScript:;

1. 注册事件(addEventListener)

why
传统:带on,唯一性,会覆盖
事件侦听注册:不带on,可添加多个监听器,不会覆盖依次执行
addEventListener
attchEvent了解
带on,解决封装,兼容性函数
在这里插入图片描述

2.删除事件(removeEventListener)

removeEventListener(事件操作,事件名字)
detachEvent(事件操作,事件名字)
在这里插入图片描述

3.DOM事件流

捕获阶段,当前目标阶段,冒泡阶段
在这里插入图片描述
注意
false冒泡阶段,默认
true捕获阶段
在这里插入图片描述

三个阶段
在这里插入图片描述

4.事件对象及其方法(当形参来看)

介绍
在这里插入图片描述
事件对象的常见属性和方法
在这里插入图片描述
e.target和this区分
在这里插入图片描述

5.阻止默认事件/冒泡

阻止默认事件
高版本e.preventDefault();(方法)
低版本e.returnValue;(属性)
在这里插入图片描述
阻止冒泡
标准e.stopPropagation();
非标准e.cancelBubble=true;
在这里插入图片描述

6.事件委托

给父节点添加侦听器
在这里插入图片描述

7.鼠标事件(禁止右键/选中文字)

右键/contextmenu和选中文字/selectstart属于事件操作
然后在方法中添加禁止默认事件
在这里插入图片描述

8.鼠标事件对象

在这里插入图片描述

在这里插入图片描述
例子、图片跟随鼠标走
在这里插入图片描述

在这里插入图片描述

8.常用键盘事件

有顺序
onkeyup和onkeydown不识别大小写
onkeypress识别大小写
在这里插入图片描述

9.键盘事件对象(keycode)

在这里插入图片描述

例子、京东按下s键定光标到搜索框
在这里插入图片描述
例子、京东快递单号查询
在这里插入图片描述
分析及用up不用down原因
在这里插入图片描述
在这里插入图片描述

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值