Javascript 制作固定导航条，未捕获的类型错误？

我正在制作一个固定的导航栏，并使用JavaScript来检测用户何时在页面上滚动

但是我面临一个问题，控制台告诉我变量导航栏是空的，之后，当我尝试向下滚动时，它开始不断生成相同的错误：未捕获类型错误：导航栏为空

我真的不知道发生了什么，所以非常感谢您的帮助，干杯

window.onscroll=function（）{
myFunction（）
};
var navbar=document.getElementById（“topNav”）；
var sticky=navbar.offsetTop；
函数myFunction（）{
如果（window.pageYOffset>=粘性）{
navbar.classList.add（“粘性”）；
}否则{
navbar.classList.remove（“粘性”）；
}
}

/*仅测试*/
身体{
高度：500vh；
}
托普纳夫先生{
背景色：#333；
溢出：隐藏；
}
.粘的{
位置：固定；
排名：0；
宽度：100%
}
.topnav a{
浮动：左；
颜色：#F72585；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
字号：17px；
}
.topnav a:悬停{
背景色：#ddd；
颜色：黑色；
}
.topnav a.active{
背景色：#F72585；
颜色：白色；
}
.右上导航{
浮动：对；
}

---

在页面完全加载后，尝试访问您的元素。诸如此类：

    window.onscroll = function () { myFunction() };

    window.onload = function () {
        var navbar = document.getElementById("topNav");
        var sticky = navbar.offsetTop;

        function myFunction() {
            if (window.pageYOffset >= sticky) {
                navbar.classList.add("sticky");
            } else {
                navbar.classList.remove("sticky");
            }
        }
    }

---

javascript可能是在呈现DOM之前执行的。尝试将其包装到函数中并执行onload。（你的代码对我很有用！