MDN JS学习之event

event 事件
event handler 事件处理器(事件fire以后运行的代码块,注册一个事件处理器)
event listener 事件监听器
监听器是监听事件的发生,处理器是事件发生以后做出的响应


event handler 有三种不同的形式:
1. object的event handler properties
有更好的跨浏览器兼容性
btn.onclick = function(){//run code here}
2.Inline event handlers ,不建议使用
(又叫event handler HTML attributes)
Press me
3.addEventListener() & removeEventListener()
可以移除无用的事件处理器,但兼容性不太好
对同一个元素可以注册多个监听器处理器,而特性形式的则只能保留最后一个处理器,前面的都会被覆盖


其他知识点:
1.handler带的参数event/eve/e event object
event object带有的target属性,就是一个指向事件发生载体的引用

2.event bubbling and capturing
针对某个元素上同一个事件被激活的时所响应的多个事件处理器

bubbling phase是从内到外,从元素本身向父节点扩散检测事件处理器
capturing phase是从外到内,从html节点开始向目标节点追踪检测事件处理器
浏览器默认的是bubbling,阻止扩散的话用e.stopPropagation();
要使用capturing phase的话,可以将addEventListener()的第三个参数设置为true

3.事件代理/委托 event delegation
要对多个子节点进行同一个事件处理,可以直接将事件处理器绑定在父节点上。并且用event.target来确认发生事件的子节点

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值