[英]PhantomJS - content loaded from click event does not load to DOM
我想测试锚标记上的click事件触发正确的DOM转换。 我在浏览器中看到的内容正常运行,并且我几乎检查了代码的每一行是否返回了所需的内容,除了当我让PhantomJS进行操作时,预期的DOM转换似乎不会触发。
这是我的代码:
page.open(url, function(status) {
if (status === "success") {
var specifications = page.evaluate(function() {
var a = document.querySelector("a[href='#Specifications']");
var e = document.createEvent('MouseEvents');
e.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
a.dispatchEvent(e);
return document.querySelector("div#Specifications").innerHTML;
});
console.log(specifications);
phantom.exit()
} else {
phantom.exit(1);
});
});
我最初只是叫document.querySelector("a[href='#Specifications']").click();
结果相同。 在我的Web浏览器中,单击该链接将触发DOM转换。 但是,我无法在PhantomJS中重现它。
因此,在花了很多时间弄清楚是怎么回事之后,这里为遇到类似问题的人们提供了一些建议。
首先,请确保您的选择器不是问题。 就我而言,我决定坚持使用文档API。 与某些人关于发送点击事件的说法不同,以下方法可以正常工作:
document.querySelector("a[href='#some_section']").click();
您也应该能够将jQuery与page.includeJs()
一起使用。
确保通过调用onResourceRequested
和onResourceReceived
调用click()
之后请求和接收页面资源,如下所示:
page.onResourceRequested = function(data, request) {
console.log("phantomJS: resource requested: " + data.url);
};
page.onResourceReceived = function(response) {
console.log("phantomJS: resource received: " + response.url);
};
最后,请确保是否正在评估在收到资源后完成的click事件之后需要插入的某些值。 我最终要做的是:
setTimeout(function() {
var data = page.evaluate(function() {
return document.querySelector('div#InsertDiv').innerHTML;
});
console.log(data);
phantom.exit();
}, 2000);
基本上,如果请求外部资源,则必须为其设置异步等待时间。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.