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

yoghurt&girl

于 2022-09-11 13:10:50 发布

阅读量1.9k

点赞数 2

分类专栏： web前端开发 JavaScript 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/ywforever/article/details/126804489

版权

web前端开发同时被 2 个专栏收录

25 篇文章

订阅专栏

JavaScript

11 篇文章

订阅专栏

我是初学JavaScript者，所以经常会遇到各种各样的问题，我把这个原因发出来是想给大家一个借鉴和参考，刚开始我看到这个问题时我第一时间也是去百度了我这个问题，得到的结果无非两种：

1、由于body和JavaScript的位置产生的，因为JavaScript的执行顺序是自上而下的嘛

2、采用window.load方法（我反正是没怎么懂哈哈~）

错误原因：这个问题的原因是因为无法获取到内部的innerHTML，通常后面都会有显示我们是错的第几行，我的错误原因就是因为innerHTML前面的那个ul标签我写错了，真的是粗心大意，所以各位小伙伴在敲写代码的时候真的要注意哟，一个符号真的可以不容小觑呀！

先给你们看看我没找到错误之前的代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jsonp百度效果</title>
</head>

<body>
    <input type="text" id="txt">
    <ul id="'ul">

    </ul>



    <script>
      
        var txt = document.getElementById("txt");
        var ul = document.getElementById("ul")
        var headEle = document.getElementsByTagName('head')[0]

       
        txt.oninput = function () {
            // console.log(txt.value);
            var scriptEle = document.createElement("script")
            scriptEle.src = " https://www.baidu.com/sugrec?&prod=pc&from=pc_web&wd=" + this.value + "&cb=summy"
            headEle.appendChild(scriptEle)
        }
        //summy是回调函数
        function summy(json) {
            // console.log(123);
            // console.log(json);
            ul.innerHTML = "" //报错无法获取内部HTML[body里面的ul我写错了]

            // console.log(json.g);
            for (var i = 0; i < json.g.length; i++) {
                // console.log(json.g[i].q);
                console.log(json.g[i]);
                var li = document.createElement('li');
                li.innerHTML = json.g[i].q;
                ul.appendChild(li)

            }

        }
    </script>
</body>

</html>