Javascript 如何在PhantomJS中滚动以触发延迟加载?
我在使用PhantomJS触发滚动延迟加载时遇到问题。以前的答案(甚至被接受的答案)都不适合我。大多数是旧的PhantomJS版本 其他问题-与我的问题几乎相同或相似,但没有或有不起作用的答案:Javascript 如何在PhantomJS中滚动以触发延迟加载?,javascript,scroll,phantomjs,Javascript,Scroll,Phantomjs,我在使用PhantomJS触发滚动延迟加载时遇到问题。以前的答案(甚至被接受的答案)都不适合我。大多数是旧的PhantomJS版本 其他问题-与我的问题几乎相同或相似,但没有或有不起作用的答案: 所有人都试图利用window.document.body.scrollTop=document.body.scrollHeight和page.evaluate(),或者即使他们试图使用正确的page.scrollPosition,出于某种原因,他们也会使用一些明确收集的硬编码滚动值,或者在滚动
所有人都试图利用
window.document.body.scrollTop=document.body.scrollHeight
和page.evaluate()
,或者即使他们试图使用正确的page.scrollPosition
,出于某种原因,他们也会使用一些明确收集的硬编码滚动值,或者在滚动可用时限制页面上的某些元素的滚动。PS:在呈现页面之前-请使用page.scrollPosition={top:0,lefT:0}代码>否则您将只看到呈现的页面底部
var vWidth = 1080;
var vHeight = 1920;
page.viewportSize = {
width: vWidth ,
height: vHeight
};
//Scroll throu!
var s = 0;
var sBase = page.evaluate(function () { return document.body.scrollHeight; });
page.scrollPosition = {
top: sBase,
left: 0
};
function sc() {
var sBase2 = page.evaluate(function () { return document.body.scrollHeight; });
if (sBase2 != sBase) {
sBase = sBase2;
}
if (s> sBase) {
page.viewportSize = {width: vWidth, height: vHeight};
return;
}
page.scrollPosition = {
top: s,
left: 0
};
page.viewportSize = {width: vWidth, height: s};
s += Math.min(sBase/20,400);
setTimeout(sc, 110);
}
sc();
- 首先设置s和sBase(当前滚动偏移量和最大滚动偏移量)
- 然后我们用幻影滚动页面到最后
- 我们定义了scroll函数,它将以pageHeight/20或400(值较低)的步长从0滚动到底部(sBase),每110毫秒滚动一次。
**如果稍微调整一下,这个函数也可以处理无限滚动。但是我给你一个基本的用法,如果页面加载太慢,应该停止使用;P
- 我们还改变了viewport,因为一些懒散的脚本仍然没有通过简单的滚动触发
即使你自己回答,问题也应该是好问题。请描述问题的具体内容,并链接到以前没有解决的问题。当然,感谢您指出这一点-我想我现在已经解决了。您可能需要将变量s
和sBase
重命名为更具描述性的名称,因为它们相对较短,并且自身携带的信息不多。尝试过(在twitter上)后,出现了两个问题:1)新元素似乎没有加载,不确定phantomjs是否禁用ajax调用?2) 页面似乎在每次迭代中都会放大,因为高度会降低,直到视口只有116px高,我认为这与问题1有关)。你知道为什么新元素没有加载吗?