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

最新推荐文章于 2024-08-20 18:02:16 发布

lily2016n

最新推荐文章于 2024-08-20 18:02:16 发布

阅读量1.1w

点赞数 1

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/lily2016n/article/details/77980547

版权

js 专栏收录该内容

30 篇文章 1 订阅

订阅专栏

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        var btn = document.getElementById('btn')
        btn.onclick = function(){
            alert('我被点了')
        }
    </script>
</head>
<body>
    <button id='btn'>点击事件</button>
</body>
</html>

2、解决办法
①当把js代码放在head里面的话，点击按钮，报错js.html:8 Uncaught TypeError: Cannot set property ‘onclick’ of null*
②放在头部的解决方法把 js代码放在window.οnlοad=function(){…………..}}里面即可解决，window.onload表示页面加载完成后执行的函数，这样JS代码即使放在中也可以完美实现效果。
③把js放在点击事件下面也不会报错。

3、原因：js按照页面自上而下的顺序说明的，先加载完按钮节点才执行的JS的点击事件才不会报错

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