javascript - 让 JS EventListener 持续运行

Question

几天前，这里有人为我提供了一个脚本解决方案，该脚本可以在滚动时更改 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");
    }
});

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

Answer 1

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

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);