Javascript 当用户向下滚动时更改css显示。没有jQuery

实际上，我想在不使用jQuery的情况下创建一个“滚动到顶部”按钮。
转到顶部功能已经开始工作。
现在，当用户向下滚动页面时，我需要自动执行

display:none

到

display:block

。反之，当它回到顶端时

<a href="#ancor-top" id="GoTop">Top</a>

#GoTop {
    display: none;
    position: fixed; 
    bottom: 20px; 
    right: 30px; 
    z-index: 99;
    border: none; 
    outline: none;
    background-color: red; 
    color: white; 
    cursor: pointer; 
    padding: 15px; 
    border-radius: 10px; 
}

#戈托普{
显示：无；
位置：固定；
底部：20px；
右：30px；
z指数：99；
边界：无；
大纲：无；
背景色：红色；
颜色：白色；
光标：指针；
填充：15px；
边界半径：10px；
}

试试这个

var goTop=document.getElementById（'goTop'）；
window.onscroll=功能（ev）{
如果（this.pageYOffset>100）{
goTop.style.display='block'；
}否则{
goTop.style.display='none'；
}
};
div{
高度：200vh；
宽度：100%；
}
#戈托普{
显示：无；
位置：固定；
底部：20px；
右：30px；
z指数：99；
边界：无；
大纲：无；
背景色：红色；
颜色：白色；
光标：指针；
填充：15px；
边界半径：10px；
}

不使用jquery，您可以通过使用Bootstrap部分和Scrollspy来实现这一点。@KarenBezas您是否将代码放在单独的文件中了？如果是，请检查路径。如果是同一条路径，你把它放在页面顶部了吗？然后用window.onload函数包装javascript，或者只是简单地将代码放在body标记的末尾。它位于body标记的开头。我已将其移动到body标记末尾之前的位置，现在它工作了；）谢谢@卡伦贝萨斯我很高兴能帮上忙：）