JS——报错Uncaught TypeError: Cannot set properties of null (setting ‘innerHTML‘)

最新推荐文章于 2024-06-24 16:30:50 发布

小刘忙着搞前端

最新推荐文章于 2024-06-24 16:30:50 发布

阅读量2.6k

点赞数

文章标签： javascript 开发语言 html

本文链接：https://blog.csdn.net/mkijnbgt/article/details/132709233

版权

Cannot set properties of null (setting 'innerHTML')，这个报错的意思是无法读取null的属性“innerHTML”，即表示找不到你想要将所写的HTML代码插入的地方。

解决办法：将DOM的读取部分的script放在body后面。或者在script标签中添加window.onload，等页面加载结束后再执行这一部分代码。

原因：浏览器加载HTML文档时，会将HTML文档解析为一个树形结构，称为DOM树，代码的执行顺序是自上而下依次执行，当执行到innerHTML这一行代码时，他并没有加载到下面的DOM结构，就会报错无法读取HTML。

1.将执行在script中的代码放在boby之后。

<body>
    <div id="text"> </div>
</body>
<script>
     if (localStorage.pagecount) {
            localStorage.pagecount = Number(localStorage.pagecount) + 1;
        }
        else {
            localStorage.pagecount = 1;
        }
        // document.write("Visits:  " + localStorage.pagecount + "  time(s).");
         var d = document.getElementById('test').innerText=localStorage.pagecount ;//通过id获取div节点对象
  // d.innerHTML =  localStorage.pagecount;//在div中追加内容22323
   console.log(localStorage.pagecount);
</script>

2.原本的script标签中添加window.onload

<script> 
    window.onload = function () {            
        if (localStorage.pagecount) {
          localStorage.pagecount = Number(localStorage.pagecount) + 1;
        }
        else {
           localStorage.pagecount = 1;
        }
     // document.write("Visits:  " + localStorage.pagecount + "  time(s).");
        var d = document.getElementById('test');//通过id获取div节点对象
        d.innerHTML =  localStorage.pagecount;//在div中追加内容22323
        console.log(localStorage.pagecount);
     }
</script>
<body>
    <div id="text"> </div>
</body>

嗯哼。完美！

小刘忙着搞前端

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS——报错Uncaught TypeError: Cannot set properties of null (setting ‘innerHTML‘)

浏览器加载HTML文档时，会将HTML文档解析为一个树形结构，称为DOM树，代码的执行顺序是自上而下依次执行，当执行到innerHTML这一行代码时，他并没有加载到下面的DOM结构，就会报错无法读取HTML。将DOM的读取部分的script放在body后面。或者在script标签中添加window.onload，等页面加载结束后再执行这一部分代码。这个报错的意思是无法读取null的属性“innerHTML”，即表示找不到你想要将所写的HTML代码插入的地方。2.原本的script标签中添加。
复制链接

扫一扫