window、document添加事件addEventListener

最新推荐文章于 2024-05-29 16:21:30 发布
最新推荐文章于 2024-05-29 16:21:30 发布
阅读量1.1w 收藏 2
点赞数
分类专栏： 前端笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37728716/article/details/81335651
版权

事件捕获，从dom结构上到下，window.addEventListener先于document.addEventListener被捕获

事件冒泡，从dom结构底层向上传递，document.addEventListener先于window.addEventListener被触发

在addEventListener第三个参数处可指定事件是否在捕获或冒泡阶段执行。

element.addEventListener(event, function(){

    }, 
    // true - 事件句柄在捕获阶段执行
    // false- 默认, 事件句柄在冒泡阶段执行
)

 

_血手人屠_
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
window.addEventlistener和document.addEventlistener区别
weixin_44753854的博客
09-10 4632
window.addEventlistener(“click”,showa,true); 括号里三个参数： 1：“click” 事件类型，有click、onmouseover……等事件类型； 2：showa （函数名称）事件触发后调用的函数； 3：true （布尔值）用于描述事件是冒泡还是捕获，可选参数，true捕获 false冒泡。 document.addEventlistener(“cli...
window.addEventListener()和document.addEventListener()区别
xinxin_zhu的博客
03-29 7008
window.addEventListener('load',function(){ //页面的全部资源加载完后才会执行 包括 图片 视频等 }) window.addEventListener('DOMContentLoaded',function(){ //Dom 渲染完即可执行 此时图片视频还可能没加载完 }) ...
window.addEventListener 用法
最新发布
ivan5277的博客
05-29 971
是JavaScript中用来为DOM元素（在本例中是浏览器窗口window）添加事件监听器的方法。这对于响应用户操作（如点击、滚动等）或页面/浏览器的特定状态变化非常有用。下面是如何使用。
【前端知识点总结】WebAPI DOM篇（二）事件
jiang_ziY的博客
03-02 413
本章内容包含：1、事件，2、事件三要素，3、注册事件的语法，4、业务中常用事件类型，5、事件对象，6、事件冒泡，7、事件捕获，8、事件委托，9、事件流的三个阶段，10、阻止事件
Dom – 1.window对象事件 + 2.body、document对象的事件
weixin_34026484的博客
05-22 78
1.window对象   （1）alert   （2）confirm   （3）navigate   （4）setInterval   （5）clearInterval   （6）setTimeout 、clearTimeout   （7）案例：实现标题栏走马灯的效果，也就是浏览器的标题文字每隔500ms向右滚动一下   （8）练习：刚进入的时...
addEventListener()使用方法
搏·梦的博客
04-10 2万+
document.addEventListener() 方法用于向文档添加事件句柄，即事件监听。先看下面代码，稍后进行讲解。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body>...
document.addEventListener
weixin_61151047的博客
12-15 1万+
document.addEventListener("事件名称", 函数, false); function 某函数(event){ // 方法执行 } addEventListener里最后一个参数决定该事件的响应顺序； document.addEventListener("事件名称", 函数, true): 如果为true时事件执行顺序为 addEventListener ---- 标签的onclick事件 ---- document.onclick 　 documen...
javascript 动态添加事件代码
10-30
在JavaScript中，动态添加事件是常见的需求，但因为不同浏览器之间的兼容性问题，需要采用不同的方法来实现。以下是关于如何在JavaScript中动态添加事件的详细讲解： 1. **setAttribute方法**： `setAttribute` 是...
window.addEventListener来解决让一个js事件执行多个函数
12-09
可能你也碰到过这种情况,就是在js的代码中用了[removed]后,可能会影响到body中的onload事件。你可以全写在body中，也可以全放到... 代码如下: if (document.all){ window.attachEvent(‘onload’,函数名)//IE中 } els
多种方法实现JS动态添加事件
10-26
在JavaScript中，动态添加事件是网页交互中的常见需求，允许我们在用户与页面交互时执行特定...在实际开发中，为了兼容性和灵活性，推荐使用通用的事件添加函数，并结合浏览器检测来确保代码在各种环境下都能正常工作。
动态的绑定事件addEventListener方法的使用
12-10
//解除绑定事件 document.getElementById(“but1”).removeEventListener(“onclick”,test); } [removed] <body> <input id = “but1” type = “button” value = “投票” /> <script language =...
document.addEventListener使用介绍
09-04
主要介绍了document.addEventListener，下面有个示例，大家可以参考下
JS中动态添加事件(绑定事件)的代码
10-28
与`addEventListener`类似，`attachEvent`也允许添加多个事件处理程序，但不同的是，所有事件处理程序会按相反的顺序执行，即最后添加的先执行。 需要注意的是，`addEventListener`支持事件捕获和冒泡阶段的分离，...
【js】window.addEventListener介绍说明
热门推荐
Q仔的博客
06-29 6万+
原型 public override function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void 作用 　　侦听事件并处理相应的函数。[1] 参数
vue中两个iframe滚动条同步滚动问题总结
weixin_45658147的博客
12-13 1333
vue中两个iframe同步滚动的需求问题总结
前端小知识总结
weixin_45869811的博客
01-27 564
1.ES6只能新增值，无法重新赋值就会报错 2.CommonJS 输出是值的拷贝，即原来模块中的值改变不会影响已经加载的该值， ES6静态分析，动态引用，输出的是值的引用，值改变，引用也改变，即原来模块中的值改变则该加载的值也改变。2：还有，如果自定义对象，开发者重写prototype之后，原有的constructor会丢失，因此，为了规范开发，在重写对象原型时一般都需要重新给 constructor 赋值，以保证对象实例的类型不被篡改。，用于判断一个变量是否某个对象的实例，内部机制是通过原型链来判断的。
window.attachEvent 和addEventListener
ChinaJweb
02-08 619
以前写JavaScript脚本时，事件都采用object.event = handler的方式绑定。这种方式对于Internet Explorer、Mozilla/Firefox和Opera来说很通用。但有一个问题，这种方式只能一个事件对应一个事件处理过程。如果希望一个事件可以依次执执行多个处理过程，就不好用了。 Internet Explorer从5.0开始，提供了一个attachEven...
JS事件流，事件冒泡，事件捕获，事件处理程序，事件对象
qq_34850703的博客
10-24 630
事件流 JavaScript操作css称为脚本化CSS,而JavaScript与HTML的交互是通过事件实现的。事件就是文档或浏览器窗口中发生的一些特定的交互瞬间，而事件流(又叫事件传播)描述的是从页面中接收事件的顺序。 历史 当浏览器发展到第四代时(IE4及Netscape4)，浏览器开发团队遇到了一个很有意思的问题：页面的哪一部分会拥有某个特定的事件？想象画在一张纸上的一组同心圆。如果把手指放在圆心上，那么手指指向的不是一个圆，而是纸上的所有圆 　　两家公司的浏览器开发团队在看待浏览器事件方面还是一致的
window.document.addEventListener
11-10
window.document.addEventListener是指在浏览器窗口中的文档对象上添加事件监听器。它可以用来捕获或冒泡事件，具体取决于事件的类型和传递方式。例如，以下代码将在文档对象上添加一个点击事件监听器： ```...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值