企业官网建设流程全解析

影刀RPA动态加载网页处理：Ajax与懒加载实战

作者：林焱

前言

2015年以前的网页是"一次加载完"，之后的网页是"一点一点加载"。你打开淘宝——骨架先出来，然后商品图片一张一张蹦出来，价格数字等JS算完才显示。

这种"异步加载"是自动化的一大挑战：你没法确定"页面已经完全加载好了"——因为永远有新东西在加载。

一、识别动态网页

特征：

• 页面先显示占位框/骨架屏，1-2秒后才填充内容

• 滚动到底部才加载更多

• 切换筛选条件后，URL不变但内容变了

• Network面板里大量XHR/Fetch请求

二、核心应对策略：等待数据而非等待页面

不要等"页面加载完成"——这个事件对动态网页没意义。等待你需要的数据出现了。

打开网页（动态页面） 等待元素出现（第一个商品的价格） ← 等数据，不等页面 开始采集

三、Ajax内容的等待

点击一个筛选条件后，页面通过Ajax重新请求数据，URL不变但内容刷新。

等待策略：

1. 记住操作前页面上的某个文本（比如当前第一个商品名）

2. 执行操作（点击筛选按钮）

3. 等待这个文本消失（旧内容被替换）

4. 等待新的内容出现

6. 开始采集新内容

两步等待（消失+出现）比一步等待（出现）更可靠。

四、懒加载图片处理

图片刚开始是占位符，滚动到可视区域才开始加载。

如果你要截图或OCR：需要等图片加载完。用JS检测图片的complete属性。

如果你只关心文字数据：不需要等图片，直接抓文本即可。

五、SPA单页应用的特殊处理

Vue/React开发的SPA，整个页面是JS渲染的。影刀打开页面时，HTML里可能只有一个<div id="app"></div>。

关键：不要用"等待网页加载完成"指令，它对SPA无效。直接用"等待元素出现"，等待JS渲染出的具体DOM元素。

六、总结

动态网页的核心原则：不等页面加载，等数据出现。关注你需要的那一个元素是否已存在，而不是整个页面是否加载完成。

下一篇讲批量下载文件。

作者：林焱

影刀RPA深耕实践者，致力于让每个普通人都能学会自动化