addeventlistener事件第三个参数_事件监听函数,以及事件的捕获和冒泡机制

更新时间:2023-06-20 22:49:26 阅读: 评论:0

"out">最外⾯
"middle">
"inner">最⾥⾯
var out = ElementById('out'); var middle = ElementById('middle'); var inner = ElementById('inner'); //点击inner时,触发顺序为:inner-------middle------out
out.addEventListener('click',function(){alert("我是最外⾯的");},fal);窦骁身高
middle.addEventListener('click',function(){alert("我是中间的");},fal);
年龄段划分标准inner.addEventListener('click',function(){alert("我是最⾥⾯的");},fal); var out = ElementById('out'); var middle =
middle.addEventListener('click',function(){alert("我是中间的");},true);
inner.addEventListener('click',function(){alert("我是最⾥⾯的");},true); var out = ElementById('out'); var middle =
middle.addEventListener('click',function(){alert("我是中间的");},fal);
inner.addEventListener('click',function(){alert("我是最⾥⾯的");},fal);var out = ElementById('out'); var middle =
middle.addEventListener('click',function(){alert("我是中间的");},true);
inner.addEventListener('click',function(){alert("我是最⾥⾯的");},fal);var out = ElementById('out'); var middle =
middle.addEventListener('click',function(){alert("我是中间的");},true);
inner.addEventListener('click',function(){alert("我是最⾥⾯的");},fal);var out = ElementById('out'); var middle =
middle.addEventListener('click',function(){alert("我是中间的");},fal);
inner.addEventListener('click',function(){alert("我是最⾥⾯的");},true);
5.事件处理程序
1. HTML事件处理程序
"test()">测试function test() {
alert("HTML事件处理程序");
}
1.优点:事件处理程序中的代码,能够访问全局作⽤域中的任何变量
2.缺点:时差问题、扩展的作⽤域链在不同浏览器中会导致不同结果、html代码与js代码⾼度耦合
思乡之情的诗
2. DOM0级事件处理程序
"btn">测试var btn = ElementById("btn");
alert("DOM0级事件处理程序");
}
喜爱听故事1.优点:代码简单,浏览器兼容性好,解决了html代码和js代码的⾼度耦合问题
2.缺点:⼀个元素只能绑定⼀个事件处理函数,只会在事件冒泡中运⾏
3. DOM2级事件处理程序
该级别的事件处理程序,运⽤的就是事件捕获和冒泡机制
"btn">测试var btn = ElementById("btn");// 事件监听
btn.addEventListener("click", function() {
苹果怎么格式化
alert("DOM2级事件处理程序,我在捕获阶段执⾏");
}, true);
btn.addEventListener("click", function() {
alert("DOM2级事件处理程序,我在冒泡阶段执⾏");
}, fal);// 移除事件监听var fun = function() {朝鲜社会主义
alert("我要被移除了");
斤斗法国特色美食
}
btn.addEventListener("click", fun, fal);
1.优点:同时⽀持事件处理的捕获和冒泡阶段,并且⼀个元素可以绑定多个处理函数
2.缺点:IE不⽀持
本⽂作者: 张舒涵
本⽂链接: imzsh.ink/20201117-eventlistener
欢迎任何形式的转载,但请务必注明出处。
由于笔者⽔平有限,如果⽂章或代码有表述不当之处,还请不吝赐教。

本文发布于:2023-06-20 22:49:26,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/fan/82/1001591.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

标签:代码   事件   处理程序   绑定   元素   触发   冒泡   问题
相关文章
留言与评论(共有 0 条评论)
   
验证码:
推荐文章
排行榜
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图