无限滚动运行后无法调用函数答案

【问题标题】：Trouble calling function after Infinite Scroll runs无限滚动运行后无法调用函数
【发布时间】：2015-04-06 23:40:29
【问题描述】：

我正在使用用于 Wordpress 的 Infinite Scroll 插件在用户滚动到底部时将新帖子加载到页面上。问题是这一直在加载重复的帖子，因为排序变化非常快（由于受欢迎程度）并且帖子最终出现在不同的页面上。

当插件抓取下一页时，有时最初在 FIRST 页面上的产品已被排序到 SECOND 页面。所以我最终得到了重复。

我计划等待脚本加载下一页内容，然后遍历所有帖子标题并找到重复项。然后我会删除每个帖子的第二个实例。

我注意到 Infinite Scroll 在设置中有一个标有“加载内容后运行/回调”的窗口，所以我想我可以在该字段中输入要调用的函数。

removeDuplicates();

然后我在页脚中输入了这样的内容：

function removeDuplicates(){
  var titleList = [];
  $('.title').each(function(i, obj) {

      /* The titles are in <h1> tags, I cycle through them, 
     if it's the first time seeing the title I add it to titleList. 
     If it's already in the array I hide the parent. */
      
  });
});

我不断收到与 .each 相关的“未定义函数”，它似乎与范围有关，但我不确定发生了什么。

是否有更简单的方法来触发删除重复项的功能？我至少在正确的轨道上吗？

感谢您提供的任何见解！

【问题讨论】：

标签： javascript jquery

【解决方案1】：

好像 jquery 没有加载。即使您使用不返回任何元素的选择器，它仍应具有.each() 方法。

尝试使用 vanillaJS 而不是 jquery。

var titleNodeList = document.querySelectorAll('.title'); // get elements
var titleElArray = Array.prototype.slice(titleNodeList); // convert to array
titleElArray.forEach(function(el){...}); // iterate

【讨论】：

感谢您的回复。我试过这个，但不幸的是它仍然无法正常工作。我在代码中看到了这条评论，指的是回调框：“以前，我们会将新的 DOM 元素作为回调的上下文传递，但是我们现在使用的是一个没有父母或孩子的文档片段，所以context 是 contentContainer 的人，我们传入一个收集的元素数组作为第一个参数。
如果元素不在文档中，选择器将不起作用。您需要调用theDocumentFragment.querySelectorAll()，而不是document.querySelectorAll()。
您的原始答案实际上几乎完成了。我必须使用 titleNodeList.length，然后针对该数字运行一个 for 循环，执行类似 titleNodeList[x].innerHTML 之类的操作。谢谢！