滚动时如何使Javascript执行？

【问题标题】：How to make Javascript execute when you scroll?滚动时如何使Javascript执行？
【发布时间】：2020-02-26 03:53:41
【问题描述】：

我正在创建一个 Tampermonkey 脚本，它允许您从 Reddit 的首页隐藏 subreddits。它工作得很好，但只在第一页。问题是，当您开始滚动时，Reddit 会加载新项目（无限滚动），并且代码不适用于添加的新项目。

我尝试添加事件侦听器，但这不起作用。滚动时项目仍会出现。

window.addEventListener("scroll", function(){

document.querySelector('a[href*="politics"]').parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.style.display='none';

});

【问题讨论】：

标签： javascript scroll infinite-scroll

【解决方案1】：

您当前的代码将选择与该选择器匹配的一个元素，导航到祖先元素，并将其显示设置为 none。该元素保留在文档中，其他元素不受影响；当未来发生scroll 事件时，将选择相同的元素，并隐藏相同的祖先（但它的display 已经是none，所以它什么都不做）。

使用querySelectorAll 遍历所有个匹配元素，并使用.remove() 从DOM 中删除它们：

window.addEventListener("scroll", function(){
  for (const a of document.querySelectorAll('a[href*="politics"]')) {
    a.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.remove();
  }
});

【讨论】：