扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
IE的事件流叫做事件冒泡。顾名思义当事件发生后,事件就开始从里向外传播,查看下方代码:
创新互联建站长期为上1000家客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为白碱滩企业提供专业的成都网站建设、网站制作,白碱滩网站改版等技术服务。拥有10余年丰富建站经验和众多成功案例,为您定制开发。
Document
如果点击页面中的
click 事件 在 直系DOM 树的每一级节点都会发生(自下而上),直到 document 对象。
又称事件代理。对“事件处理程序过多”问题的解决方案就是事件委托。事件委托利用了事件冒泡,只指定一个父类事件处理程序,就可以管理某一类型的所有子类元素事件。
专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节,不停更新最新的教程和学习技巧(从零基础开始到前端项目实战教程,学习工具,全栈开发学习路线以及规划)
三个
document.getElementById('sayHi').onClick(function(){...})
点击事件不多的情况下还好,若是所有元素都采用这样的方式,结果就会有数不清的代码用于添加事件处理。就好比一万个人全挤到公司前台去拿快递,那场面,蔚为壮观啊!但是把快递放到前台,前台接收,然后分批次派送,就会舒服很多:
document.getElementById('myList').onClick(function(ev){
var e = ev || window.event;
var target = e.target;
switch (target.id) {
case 'goSth':
...
break;
case 'doSth':
...
break;
...
}
})
上面是用事件委托的方式,子元素是带有事件效果的,我们可以发现,当用事件委托的时候,根本就不需要去遍历元素的子节点,只需要给父级元素添加事件就好了,子元素点击,会通过以事件冒泡的方式激活父元素已添加的相同事件,减少了很多 js 对于 dom 的事件操作,占用更少的内存,这大概是事件委托的精髓所在。
所有用到按钮的事件(多数鼠标和键盘事件)都适合采用事件委托。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流