时间戳

首页 > 解决方案 > 如何使用 JavaScript 从动态滚动列表中获取所有元素？

javascript - 如何使用 JavaScript 从动态滚动列表中获取所有元素？

问题描述

就像标题所说，我如何从滚动 div 中获取所有元素？ 滚动列表中的元素是动态加载和销毁的。

我试图从这个网站上抓取所有课程名称： https ://public.enroll.wisc.edu/search?term=1204

下面的代码只适用一次：

let list = document.getElementsByClassName('md-virtual-repeat-scroller')[0]
let childs = document.getElementsByClassName("result__name")
console.log(childs[0].innerText)

但是，如果我这样做，我将得到 10 次相同的结果：

let list = document.getElementsByClassName('md-virtual-repeat-scroller')[0]
for(let i = 0; i < 10; i++) {
    let childs = document.getElementsByClassName("result__name")
    for(let j = 0; j < childs.length; j++) {
        console.log(childs[j].innerText) 
    }
    // scroll by 1000px every time
    list.scrollBy(0, 1000) 
}

我不知道有什么问题。是因为scrollBy()异步工作吗？但我尝试使用异步和等待。它仍然不起作用。

标签： javascriptnode.jsweb-crawlersingle-page-applicationpuppeteer

解决方案

尽可能用更少的话提供更多信息。例如，许多问题可能与浏览器及其版本有关。这个脚本是怎么调用的？您是否通过浏览器控制台发出命令？您是否复制了该站点并对其进行了一些修改？在现实层面上很难理解这个问题。

提示：避免使用innerText。它速度较慢，并且在许多浏览器中受支持只是为了兼容写入旧版本 IE 的脚本。（我不知道为什么互联网上有这么多例子使用它作为首选）。用户textContent代替。

测试函数/方法的返回值总是好的 - 特别是在程序开发期间。

永远不要要求 StackOverFlow 社区（以及任何其他社区）为您编写程序！

您质疑“我如何从滚动 div 中获取所有元素？” 太“松”了。滚动div？这个问题的答案，独立于“div 的类型”（和标签！）将在下面找到。

为了做你想做的事，你的代码似乎没有意义。为什么要从 0 迭代到 10？

看看这个片段。我想它会帮助你

const list = document.getElementsByClassName('md-virtual-repeat-scroller')[0];// if there is no intention to reassign it. Use [0] if you are sure it's the first element of this collection
let childs = list.getElementsByClassName("result__name"); // get only elements inside the first variable!

使用变量的迭代器。

for(item of childs) 
{
 /*code*/ 
}

我相信你会实现你的目标！

永远不要建议我们（社区）为您编写代码，甚至解决您的问题。这听起来非常激进！也给你！我确定。

推荐阅读