Javascript 使JS EventListener持续运行

几天前，这里有人为我提供了一个脚本解决方案，该脚本在滚动时更改div的颜色

这是我使用的代码：

    const x = document.getElementById("menuID");
window.addEventListener("scroll", () => {
    if(window.pageYOffset >= 105 && window.pageYOffset < 775){
        x.classList.add("color1");
    } else {
        x.classList.add("color2");
    }
});

const x=document.getElementById（“menuID”）；
window.addEventListener（“滚动”，（）=>{
如果（window.pageYOffset>=105&&window.pageYOffset<775）{
x、 添加（“颜色1”）；
}否则{
x、 添加（“颜色2”）；
}
});

---

它可以工作，但是我希望它在加载页面后继续工作，这样它就可以更改为“color.2”。这可能吗？

在文档上再添加一个事件侦听器，并从那里运行相同的回调：

const x = document.getElementById("menuID");
function callback(){
    if(window.pageYOffset >= 105 && window.pageYOffset < 775){
        x.classList.add("color1");
    } else {
        x.classList.add("color2");
    }
}

window.addEventListener("scroll",callback);
window.addEventListener("load",callback);

const x=document.getElementById（“menuID”）；
函数回调（）{
如果（window.pageYOffset>=105&&window.pageYOffset<775）{
x、 添加（“颜色1”）；
}否则{
x、 添加（“颜色2”）；
}
}
addEventListener（“滚动”，回调）；
addEventListener（“加载”，回调）；

一种方法是使用setTimeout（）方法，通过这种方法，您可以确定希望函数触发的时间间隔。我猜情况已经是这样了。但是，当类被添加时，您的div不会变回其原始颜色，但不会被更改/删除。正如Frank指出的，您包含的代码说“添加这个类，否则，添加这个其他类”。它在任何时候都不会删除或切换任何类。一旦你添加了

color2

，它就永远不会被删除。感谢你指出这一点，事实上，我在阅读了你们的文章后，确实尝试在else语句中使用x.classList.remove（“color1”），但没有成功