报错”Cannot read property 'addEventListener' of null“

时间:2022-04-10 00:33:25

1.报错:Cannot read property 'addEventListener' of null

报错”Cannot read property 'addEventListener' of null“

2.解决方案:

  把代码放到window.onload=function(){...}里面,因为如果页面还没加载到btn按钮而且你代码是放在btn按钮的前面,你就调用了getElementById,返回的对象是undefined.

报错”Cannot read property 'addEventListener' of null“

3.window.onload用法详解:

网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式:

一.将脚本代码放在网页的底端,这样在运行脚本代码的时候,可以确保要操作的对象已经加载完成。

二.通过window.onload来执行脚本代码。window.onload是一个事件,当文档加载完成之后就会触发该事件,可以为此事件注册事件处理函数,并将要执行的脚本代码放在事件处理函数中,于是就可以避免获取不到对象的情况

4.document.ready和window.onload的区别

  在Jquery里面,我们可以看到两种写法:$(function(){}) 和$(document).ready(function(){})

这两个方法的效果都是一样的,都是在dom文档树加载完之后执行一个函数(注意,这里面的文档树加载完不代表全部文件加载完)。

而window.onload是在dom文档树加载完和所有文件加载完之后执行一个函数。也就是说$(document).ready要比window.onload先执行。

报错”Cannot read property 'addEventListener' of null“的更多相关文章

  1. js执行函数报错Cannot set property 'value' of null怎么解决?

    js执行函数报错Cannot set property 'value' of null 的解决方案: 原因:dom还没有完全加载 第一步:所以js建议放在body下面执行, 第二步:window.on ...

  2. hexo 报错 Cannot read property 'replace' of null

    详细错误信息: FATAL Cannot read property 'replace' of null TypeError: Cannot read property 'replace' of nu ...

  3. echarts js报错 Cannot read property 'getAttribute' of null

    本文将为您描述如何解决 eharts.js报错 Uncaught TypeError: Cannot read property 'getAttribute' of null 的问题 根据报错信息查找 ...

  4. 【jQuery学习】用JavaScript写一个输出多选框的个数报错:Cannot set property 'onclick' of null"

    说明:代码段来源于:<锋利的jQuery> 根据代码段我补充的代码如下: <!DOCTYPE html> <html> <head> <meta ...

  5. 小程序分享报错 Cannot read property &&num;39&semi;apply&&num;39&semi; of null&semi;at page XXX onShareAppMessage function

    Cannot read property 'apply' of null;at page XXX onShareAppMessage function 然后看了下自己的代码,分享按钮在子组件里, at ...

  6. 在vue中使用echarts报错Cannot read property getAttribute of null

    报错信息如下: 报错代码: mounted() { // ... this.drwaCharts() // drawCharts方法为自己定义的包含渲染 echarts 图表的方法 // ...} 之 ...

  7. jquery easyui datagrid 空白条处理 自适应宽高 格式化函数formmater 初始化时会报错 cannot read property &&num;39&semi;width&&num;39&semi;&vert;&vert;&&num;39&semi;length&&num;39&semi; of null&vert;undefined

    1---表格定义好之后右侧可能会有一个空白条 这个空白条是留给滚动条的,当表格中的一页的数据在页面中不能全显示时会自动出现滚动条,网上有很多事要改源码才可以修改这个,但是当项目中多处用到时,有的需要滚 ...

  8. dubbo-admin-2&period;5&period;3 运行报错: Bean property &&num;39&semi;URIType&&num;39&semi; is not writable or has an invalid 解决方法

    因为 jdk 是1.8的版本,和 dubbo-admin 存在兼容性问题.所以报错: Bean property 'URIType' is not writable or has an invalid ...

  9. 小程序 for循环 报错 Cannot read property &&num;39&semi;total&&num;39&semi; of undefined

    for循环一直报错  Cannot read property 'total' of undefined,但total在起初是有定义的,后来找到了问题,是i<=的问题,改为<不报错了. i ...

随机推荐

  1. UDS&lpar;ISO14229-2006&rpar; 汉译&lpar;No&period;1 范围&rpar;

    ISO14229指定的数据链路是独立于诊断服务的,该数据链路允许测试仪(Client)操作ECU(Server)中的诊断功能(如电子燃油喷射.变速箱.ABS等)并接入一条嵌入车辆的串行数据链路.它指定 ...

  2. Jquery仿彩票更换数字动画效果

    <script type="text/javascript" src="jquery-1.11.3.min.js"></script> ...

  3. django的信号

    Django中提供了“信号调度”,用于在框架执行操作时解耦.通俗来讲,就是一些动作发生的时候,信号允许特定的发送者去提醒一些接受者. 1.Django内置信号 Model signals pre_in ...

  4. BZOJ2463 谁能赢呢?

    Description   小明和小红经常玩一个博弈游戏.给定一个n×n的棋盘,一个石头被放在棋盘的左上角.他们轮流移动石头.每一回合,选手只能把石头向上,下,左,右四个方向移动一格,并且要求移动到的 ...

  5. HDU 3032 Nim or not Nim&quest; (sg函数求解)

    Nim or not Nim? Problem Description Nim is a two-player mathematic game of strategy in which players ...

  6. mysql数据库参数innodb&lowbar;buffer&lowbar;pool&lowbar;size和max&lowbar;connections

    接到报故,查看mysql数据库以下参数 1.innodb_buffer_pool_size 2.max_connections 该参数定义了数据缓冲区buffer pool大小,类似于oracle的d ...

  7. static方法与非static方法是否可以互相调用

    情况一.static方法调用非static方法 非静态方法只有实例对象才可调用,而静态方法随着类的加载而加载,类的加载在实例对象产生之前,所以静态方法不能调用非静态方法 情况二.非atic方法调用st ...

  8. lua 模块

    lua 模块 概述 lua 模块类似于封装库 将相应功能封装为一个模块, 可以按照面向对象中的类定义去理解和使用 使用 模块文件示例程序 mod = {} mod.constant = "模 ...

  9. 将IDEA maven项目中src源代码下的xml等资源文件编译进classes文件夹

    如果使用的是Eclipse,Eclipse的src目录下的xml等资源文件在编译的时候会自动打包进输出到classes文件夹.Hibernate和Spring有时会将配置文件放置在src目录下,编译后 ...

  10. &lbrack;深度学习工具&rsqb;&&num;183&semi;极简安装Dlib人脸识别库

    [深度学习工具]·极简安装Dlib人脸识别库 Dlib介绍 Dlib是一个现代化的C ++工具箱,其中包含用于在C ++中创建复杂软件以解决实际问题的机器学习算法和工具.它广泛应用于工业界和学术界,包 ...