JavaScript事件

126 阅读2分钟

「这是我参与11月更文挑战的第15天,活动详情查看:2021最后一次更文挑战」 。

一:注册事件

1:传统注册事件

语法:

事件源.事件类型 = function() {
                函数体
            }

(1)传统注册采用冒泡事件流

(2)不可以给一个事件源重复注册相同事件,会先销毁旧的然后覆盖新的

2:事件监听

语法:

事件源.addEventListener'事件类型',事件执行函数)

(1)事件监听既有冒泡事件流,也有捕获事件流,捕获事件流的优先级高,如果同时出现先执行捕获事件流

(2)可以给一个事件源重复注册相同事件,先写的先执行,后写的后执行

二:删除事件

1.传统注册事件的删除:

事件源.事件类型 = null

2.事件监听的删除:

事件源. removeEventListener('事件类型',函数名)

注意:移除事件只能移除具名函数,不能移除匿名函数,这里不可以直接写函数体,两个函数体会被分别存在两个堆里,获取到的是两个不同的堆地址,所以无法删除,将函数命名,写函数名就可以了

三:常用鼠标事件

onclick——>鼠标单击

ondblclick——>鼠标双击

onfcous——>鼠标获得焦点

onblur——>鼠标失去焦点

onchange——>当用户改变输入字段内容的时候

onmousedown :鼠标按下

onmouseup :鼠标释放

onmousemove——>鼠标移动

onmouseover/onmouseout——>鼠标移入/移出

onmouseenter/onmouseleave——>鼠标移入/移出

onmouseover/onmouseout支持冒泡,鼠标经过父盒子和子盒子都会触发事件 onmouseenter/onmouseleave不支持冒泡,鼠标只有经过它本身的时候才会触发事件

四:常用键盘事件

onkeypress:键盘按下(对操作键无效)

onkeydown:键盘按下

onkeyup:键盘弹起

oninput——>输入,当用户开始输入的时候

五:键盘事件对象

e.key——>可以获得具体按键,获得的是字符串

e.keyCode——>可以获得具体按键的ASCLL码值