JavaScript——onload事件

加载 JS 时出现Cannot read property 'appendChild' of null错误：

<head>
    <script>

        let li = document.createElement("li");
        let text = document.createTextNode("广州");
        /*将 广州 添加到li*/

        li.appendChild(text);
        let box2 = document.querySelector(".box1 .box2");
        console.log(box2);
        box2.appendChild(li);
        }
    </script>
</head>

<body>
    <div class="box1">
        <div class="box2">你好</div>
</body>

定位：

经过筛查发现错误出现在对象box2段，box2为null。
querySelector查询不到选择器的字符串.box .box2。
问题原因：

检查代码发现，script标签写在页面上边，而浏览器中文档的加载顺序是自上而下，当读取querySelector(".box .box2")时页面中html代码还未读取，因此导致box2对象为null，从而调用appendChild（）时出现Cannot read property 'appendChild' of null。
解决方法：
window.οnlοad=function(){}
onload事件在页面加载完后才触发，为window绑定onload事件。