在用户滚动时继续修改 DOM
Continue modifying DOM as user scrolls
我有一个 chrome 扩展，可以根据关键字修改 DOM。问题是，对于像 twitter 这样有无限滚动的网站，我需要一种方法让我的函数在用户滚动页面时继续触发。
.livequery()是唯一的方法还是有更好的方法？
现在所有的逻辑都很简单 JavaScript/Jquery，但如果这是最好的方式，我愿意使用像 Angular 这样的框架。
I have several functions that interact -
1) a hide() function that adds a class to divs containing words I want hidden
2) a walk() function that walks the DOM and identifies divs to call hide() on
3) walkWithFilter() function that gets words to filter from localstorage and calls walk() function
最后一个函数 walkWithFilter() 在 window.onload() 事件中调用
看来 onScroll 活动很适合这个。诀窍是您需要跟踪已经处理过的内容以避免重新处理旧内容。如果您假设用户总是在现有内容下方公开新内容，那么这可能就像保持指向最后处理的项目的指针并从那里重新启动 walkWithFilter 方法一样简单。不过，这对我来说似乎不是一个完全安全的假设。
如果你想在这方面更加稳健，你可以尝试虚拟 DOM 方法：你维护一份你上次看到的 DOM 的副本，将它与 DOM 因为它当前存在，并进行比较。我知道有很多 premade libraries for this kind of thing, but I haven't used any and can't recommend a specific one (the link just goes to the first example that showed up in Google). It also doesn't appear to be overly burdensome to roll your own，如果你愿意的话。
我有一个 chrome 扩展，可以根据关键字修改 DOM。问题是，对于像 twitter 这样有无限滚动的网站，我需要一种方法让我的函数在用户滚动页面时继续触发。
.livequery()是唯一的方法还是有更好的方法？
现在所有的逻辑都很简单 JavaScript/Jquery，但如果这是最好的方式，我愿意使用像 Angular 这样的框架。
I have several functions that interact -
1) a hide() function that adds a class to divs containing words I want hidden
2) a walk() function that walks the DOM and identifies divs to call hide() on
3) walkWithFilter() function that gets words to filter from localstorage and calls walk() function
最后一个函数 walkWithFilter() 在 window.onload() 事件中调用
看来 onScroll 活动很适合这个。诀窍是您需要跟踪已经处理过的内容以避免重新处理旧内容。如果您假设用户总是在现有内容下方公开新内容，那么这可能就像保持指向最后处理的项目的指针并从那里重新启动 walkWithFilter 方法一样简单。不过，这对我来说似乎不是一个完全安全的假设。
如果你想在这方面更加稳健，你可以尝试虚拟 DOM 方法：你维护一份你上次看到的 DOM 的副本，将它与 DOM 因为它当前存在，并进行比较。我知道有很多 premade libraries for this kind of thing, but I haven't used any and can't recommend a specific one (the link just goes to the first example that showed up in Google). It also doesn't appear to be overly burdensome to roll your own，如果你愿意的话。