Cannot read property 'addEventListener' of null

本文详细解释了在页面未完全加载时尝试添加事件监听器导致的'Cannot read property 'addEventListener' of null'错误。提供了几种解决方案,包括调整脚本位置、使用DOM就绪事件和jQuery库。

今天打开页面的时候遇到个问题,Cannot read property 'addEventListener' of null

原因:在页面还没有加载完成后这段监听的js代码已经执行,所以在执行这段代码的时候监听的DOM节点还没有加载创建,所以根本就找不到监听的元素。所以返回null。

解决方法:

1.等待页面完全加载完了再加载这段Js即可;

2.在原生js中的解决方法:

     1.将脚本放在页面的底部。
     2.在加载事件中调用附加代码。
     3.使用jQuery库,它是DOM就绪事件。
什么是jQuery ready事件?
JavaScript提供了在页面呈现时执行代码的加载事件,但是直到所有资源(如图像)都被完全收到为止,才会触发该事件。 在大多数情况下,只要DOM层次结构完全构建,脚本就可以运行。 传递给.ready()的处理程序保证在DOM准备好后执行,所以这通常是附加所有其他事件处理程序的最佳位置...
--------------------- 
原文:https://blog.youkuaiyun.com/lzrit/article/details/81589548 
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值