js点击事件的时候浏览器报错，提示Uncaught TypeError: Cannot set property 'onclick' of null

最新推荐文章于 2024-04-26 19:07:45 发布
最新推荐文章于 2024-04-26 19:07:45 发布
阅读量418 收藏
点赞数
分类专栏： JavaScript 文章标签： JS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_32539403/article/details/100914847
版权

1、把js代码放在head或者事件之前会报错

当把js代码放在head里面的话，点击按钮，报错js.html:8 Uncaught TypeError: Cannot set property ‘onclick’ of null* 

2、解决办法 
把 js代码放在window.οnlοad=function(){…………..}; 里面即可解决，window.onload表示页面加载完成后执行的函数，这样JS代码即使放在中也可以完美实现效果。 

3、原因

js按照页面自上而下的顺序执行，先加载完按钮节点才执行的JS的点击事件才不会报错。

页面上的Javascript代码是HTML文档的一部分，所以Javascript在页面装载时执行的顺序就是其引入标记

柳絮9712
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ASP.NET MVC运行出现Uncaught TypeError: Cannot set property __MVC_FormValidation of null的解决方法
10-29
同一相站点，有些页面的客户端验证能工作，而有些死活不行。打开页面就出现Uncaught TypeError: Cannot set property __MVC_FormValidation of null错误
解决Ajax方式上传文件报错"Uncaught TypeError: Illegal invocation"
10-16
然而，开发者在实现这一功能时可能会遇到一些错误，如"Uncaught TypeError: Illegal invocation"。这个错误通常出现在尝试使用Ajax发送文件数据时，由于不正确的数据处理或内容类型设置导致的。 Ajax上传文件的核心...
Uncaught TypeError: Cannot set property 'onclick' of null
qq_41343668的博客
03-09 219
今天在学习js的过程中想要用最基本的js代码实现背景颜色的改变，但发现有报错 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> ...
如何修复JavaScript中的 “Uncaught TypeError: Cannot set properties of null (setting ‘onclick‘)” 错误
最新发布
m0_66432226的博客
04-26 302
如何修复JavaScript中的 “Uncaught TypeError: Cannot set properties of null (setting ‘onclick‘)” 错误
Uncaught TypeError: Cannot set property ‘onclick‘ of null
紫月i的博客
10-19 493
在使用vue时报错Uncaught TypeError: Cannot set property ‘onclick’ of null，原因是因为vue项目是有加载顺序的，当页面还没加载完成时js代码就已经执行了，因为获取不到而报错，只需要把代码写在onload函数当中就行 window.onload = function(){ var btn = document.querySelector('#btn'); btn.onclick = function(){ console.lo.
(原创)JS点击事件——Uncaught TypeError: Cannot set property 'onclick' of null
kakamonster的博客
05-04 1911
html部分代码： JS部分代码：需要实现的效果：点击图片，来回相互切换。我开始的错误做法：代码如上图所示（逻辑上看起来是没有错误的）尝试过程：把JS代码放在&lt;/body&gt;闭合标签之前运行是没有问题的，单独写在JS代码文件中，从head标签内引入JS文本，报错Uncaught TypeError: Cannot set property 'onclick' of null最终解决方案：...
Uncaught TypeError: Cannot set property ‘onclick‘ of undefined JavaScript
SugarXiXixi的博客
09-26 1593
未捕获类型错误 ,显示页面上的标签找不到， 原因：<script>标签先加载，而承载Js dom操作的元素还未加载 提示：以下是本篇文章正文内容，下面案例可供参考 一、将<script>标签放在</body>标签后 先加载HTML元素，在加载js 二、使用window.onload函数 重新加载 先加载js，等页面加载完全后，在重新加载一次 window.onload=()=>{ let list=document.get...
Vue报错：Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#Object‘的解决方法
12-09
当你遇到“Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'”这样的错误，通常是因为在同一个模块中混用了CommonJS（`require`和`module.exports`）和ES6模块（`import`...
Vue报错：Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#&lt;Object&gt;‘的解决
08-30
在Vue开发过程中，有时会遇到一个常见的错误：`Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'`。这个错误通常发生在使用Webpack打包Vue应用时，由于模块导入导出规范的...
Uncaught TypeError: cannot set property “onclick” of undefined 解决办法
单车去旅行的博客
06-24 6057
如果把js内容直接放在这个head标签以内，button按钮不能正常点击更换body的背景颜色，报错提示：demo6.html:16 Uncaught TypeError: Cannot set property 'onclick' of null，分析解决办法如下： <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta nam
解决Uncaught TypeError: Cannot set property 'onclick' of null错误的方法
热门推荐
wls.ink
04-13 5万+
问题分析：当JS文件放在head标签里中时，并且绑定了onclick事件，就出现了这个错误 原因： W3School中介绍浏览器先加载完按钮节点才执行JS，当浏览器自顶向下解析时，找不到onclick绑定的按钮节点了 如下面这个例子： <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-...
浏览器出现Cannot set property 'onclick' of null的问题
webGIS成长记录
08-27 637
当js文件放在head里面时，如果绑定了onclick事件，就会出现这样的错误，是因为W3School的写法是浏览器先加载完按钮节点才执行的js，所以当浏览器自顶向下解析时，找不到onclick绑定的按钮节点，于是报错。因此，需要把js文件放在底部加载，就会避免该问题。 或者可以在js外包window.onload=function(){}
JS事件报错Cannot set property ‘onclick‘ of null，原因及解决方法
Zebra的博客
04-04 1920
目录 报错信息： 那么为什么会报错呢？ 解决方法： 报错信息： 在使用js的时候报以下错误 下面是对应的文件 my.js文件： document.getElementById("button").onclick=function () { document.getElementById("head").innerHTML = "Teleporter"; }; html代码（引入了上面的js文件） <!DOCTYPE html> <html lang=
Uncaught TypeError: Cannot set property ‘onmouseout‘ of null
weixin_44385360的博客
12-02 828
html页面引入js文件，改完html后报错Uncaught TypeError: Cannot set property ‘onmouseout’ of null js代码块： //页面加载完成后注册变迁选择下拉框的鼠标移出,移入事件 varisFocusTag=false; varST=document.getElementById('selectTag'); alert(ST); ST.onmouseout=function(){ isFocusTag=false; } ST为null 1、检查前
html保存时出现nul,不理解为什么一直提示联系.html:23 Uncaught TypeError: Cannot set property 'onmouseover' of nul ，检查...
weixin_28952633的博客
06-11 220
源自：6-2 完美运动框架不理解为什么一直提示联系.html:23 Uncaught TypeError: Cannot set property 'onmouseover' of nul ，检查了好多遍，不懂问题出在那块儿，哪位大神帮忙看下，谢谢ldbhsdiv{width:200px;height:100px;background-color:yellow;border:2px solid...
Cannot set property 'onclick' of null
lh1616的专栏
03-20 652
转自http://www.cnblogs.com/jeacy/p/6501819.html 摘要: 今天测试使用 HTML DOM 来分配事件，提示Uncaught TypeError: Cannot set property ‘onclick’ of null 摘要: 测试点击事件的时候浏览器报错，提示Uncaught TypeError: Cannot set property ‘oncl...
ECharts报错：Uncaught TypeError: Cannot read properties of null (reading 'getAttribute')
10-19
1. 在created钩子函数中初始化ECharts，此时DOM元素还没有生成，因此找不到对应的id，会报错。解决方法是将初始化ECharts的方法放在mounted钩子函数中，因为在mounted钩子函数中，DOM元素已经挂载完成。 2. 在HTML中...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值