行业资讯
影刀RPA 网页滚动加载的稳定处理：到底部加载新内容的正确姿势
影刀RPA 网页滚动加载的稳定处理到底部加载新内容的正确姿势“为什么只采了20条页面上明明有200条”——这是采集无限滚动页面时新手最常遇到的问题。答案是你没等新内容加载出来就去取数据了。这篇文章把滚动加载的三种模式讲清楚到底部触发加载、滚动到某个位置触发加载、手动点击加载更多。每种模式给出稳定的处理方案。先判断页面用的是哪种加载方式F12 → Network面板 → 清空 → 然后手动操作页面。观察模式A滚动到底部自动加载。手动滚到页面最底部发现加载圈转了一下新内容出现了。Network面板里会看到一个新的API请求通常是XHR类型返回了下一批数据。模式B滚动到某个元素位置触发加载。页面一开始只显示前20条当你滚到第15条左右时后面的内容才加载出来。这种方式叫懒加载或可视区域触发。模式C点击加载更多按钮。页面上有个查看更多或加载更多的按钮点一下出下一批。每批出固定条数。模式A滚动到底部加载无限滚动最典型的就是微博时间线、抖音评论区、知乎回答列表。拼多多店群自动化报活动上架错误做法【滚动到元素】→ 滚动到页面底部元素 【获取元素列表】→ 立刻取数据# ← 此时新数据还在加载中取的还是旧的正确做法等数据稳定后再取核心思路每滚一次等新数据加载出来确认数据条数不再增长后再采集。page_num1prev_count0all_items[]WHILETrue:# 1. 滚动到底部【执行JS】window.scrollTo(0,document.body.scrollHeight)# 2. 等待新内容加载【等待3秒】# 给加载动画时间# 3. 获取当前数据条数【执行JS】document.querySelectorAll(.item).length current_count当前元素数量# 4. 判断是否还有新数据IF current_countprev_count:# 连续滚了多次没有新数据可能到底了【等待5秒】# 再给一次机会【执行JS】document.querySelectorAll(.item).length IF 数量还是不变:BREAK# 真的没了prev_countcurrent_count 【日志输出】第 {page_num} 次滚动当前共 {current_count} 条page_num1# 5. 数据加载完成开始采集【获取元素列表】→ 采集所有数据优化用等待元素替代固定等待上面的方案用了固定等待3秒。网络快的时候浪费时间网络慢的时候可能不够。优化一下——等待加载中的指示器消失【滚动到底部】 【等待元素】→ 等待加载中的图标出现可选 【等待元素】→ 等待加载中的图标消失 → 超时10秒 【等待 1 秒】→ 额外缓冲 【获取元素列表】如果页面上没有明确的loading指示器可以用元素数量不再变化来判断。但数量检测本身也需要等一段时间。模式B懒加载可视区域触发某些列表比如搜索结果页、商品列表页采用了懒加载——你滚到某个位置那附近的图片或内容才渲染。处理策略逐步滚动每一步给渲染时间。【获取元素列表】→ items目前可能只有部分渲染了 FOR EACH item IN items:【滚动到元素】→ 滚动到当前item 【等待0.5秒】# 给懒加载渲染时间【获取元素文本】→ 提取数据 END FOR注意滚动到每个元素会触发它的渲染但如果页面逻辑是滚动到底部才加载新一批只滚到中间某个元素可能触发不了。更稳健的方案分段滚动。item_height300# 每个商品卡片的大概高度像素total_height800# 初始可见高度WHILE total_height预计最大高度:【执行JS】window.scrollTo(0,{total_height}) 【等待2秒】 total_height600# 每次向下滚600像素每段滚动之间留足够的渲染时间。这个方法的缺点是需要预计最大高度——你可以先手动滚到底在F12里看document.body.scrollHeight记下来作为参考。模式C点击加载更多按钮最常见于电商平台、新闻网站。加载更多按钮点一下出20条再点一下再出20条。WHILETrue:# 1. 检查加载更多按钮是否存在【执行JS】 var btndocument.querySelector(.load-more-btn);if(!btn||btn.style.displaynone)returnfalse;returntrue;btn_existsJS返回结果 IF btn_existsFalse:BREAK# 2. 记录点击前的数据条数prev_count当前元素数量# 3. 点击加载更多【点击元素】→ 加载更多按钮# 4. 等待新数据加载【等待元素】→ 等待新元素出现元素数量增加 或者等待 loading 图标消失# 5. 验证数据确实增长了current_count当前元素数量 IF current_countprev_count:# 点了按钮但没有新数据【等待3秒】# 再等一下再次检查 IF 还是没变:BREAK# 确实没了【日志输出】已加载 {current_count} 条点击加载更多的常见坑坑1按钮被广告或页脚挡住了。滚动到按钮位置时页面底部可能有固定的广告条挡住了按钮。影刀点按钮实际点到了广告上。解决先把页面滚得稍微往上一点让按钮完全暴露出来再点击。// 先滚到按钮上方一点varbtndocument.querySelector(.load-more-btn);btn.scrollIntoView({block:center});坑2点击后按钮变成加载中…然后消失。有些网站在加载过程中按钮文案会变。如果你的选择器是基于按钮文本的按钮文本变了就找不到了。解决选择器不要依赖文本内容用class或id。坑3最后一页没有加载更多按钮。TEMU店群矩阵自动化运营核价报活动当数据全部加载完毕后按钮消失或者变成没有更多了。你的循环需要在按钮消失时自然退出而不是报错。通用稳定方案三层保险不管哪种加载方式可以套用这个三层保险外层循环最多滚50页防止无限循环 ↓ 中层循环每次操作后等待、检查 ↓  内层检查确认前后数据量有变化没变化就重试/退出max_scrolls50scroll_count0prev_count0no_change_count0# 连续无变化的次数WHILE scroll_countmax_scrolls:# 执行滚动或点击加载更多执行加载操作# 等待【等待3秒】# 检查数据量current_count获取当前数据条数 IF current_countprev_count:no_change_count1IF no_change_count3:【日志输出】连续3次无新数据停止加载BREAK ELSE:no_change_count0# 有新数据重置计数prev_countcurrent_count scroll_count1【日志输出】f第{scroll_count}次加载共{current_count}条连续3次没有新数据才退出避免因为网络波动导致的误判。采集特定区域内的滚动列表有些页面的滚动列表不是在整个页面上滚动而是在一个特定div区域里滚动。比如钉钉审批列表、飞书表格。识别方法F12 → 选中列表区域 → 看它的CSS有没有overflow: auto或overflow: scroll。滚动方法不能用window.scrollTo要针对特定元素滚动。// 对特定div进行滚动varcontainerdocument.querySelector(.list-container);container.scrollTopcontainer.scrollHeight;// 滚到底在影刀里通过【执行JS】把这段代码放进去。每次滚动后同样需要等待和检查。总结滚动加载的核心不是怎么滚而是怎么确认数据已经加载完了。固定等待不可靠数量比较是底线。三层保险最大次数数量比对连续无变化退出是最稳的方案。作者林焱
郑州网站建设
网页设计
企业官网
