【经验分享】关联元素“大战”网页懒加载的故事

关于网页懒加载的场景介绍可以参考这篇文档：网页懒加载场景介绍👈

现有的懒加载解决方案大部分是通过循环相似元素，循环完一轮后通过滚轮滚动网页再继续下一次循环，偶尔会出现操作重复，元素校验不完全等因素而导致流程的不稳定。

此方案是先获取网页懒加载元素列表的第一个元素，通过第一个元素关联它的下一个相邻元素，使用无限循环一直循环当前元素的下一个相邻元素，用悬浮元素指令来代替滚动的操作让它自动加载出下一个元素。当循环到最后一个元素时它的下一个相邻元素会变成空值，再用空值当作判断退出循环的条件，以此来达到循环相似元素的效果。

下面用淘宝消息页来验证此方案的可行性。

淘宝消息页是一个比较经典的同时具有懒加载和跨域场景的网页(见下图，buff叠满)，捕获相似元素只能校验到当前页面渲染出的元素，滚动网页后右侧的源码部分也不会新增层级，算是断了通过xpath获取相似元素的方法，使用懒加载指令会出现死循环的情况😣。

下面是使用关联相邻元素的方法👇

经过测试，网页上大部分懒加载场景都可以使用这个方法，暂时还没有遇到此方法无法解决的懒加载场景，大家如有碰到的可以在下面反馈🌹