CasperJS waitForSelector工作,但querySelector null
问题描述:
我正在使用CasperJS,我可以从waitForSelector获得“成功”,但是当我尝试为相同的选择器做document.querySelector - 它返回null?CasperJS waitForSelector工作,但querySelector null
我的代码
"use strict";
var casper = require('casper').create({
verbose: false,
logLevel: 'warning',
waitTimeout: 10000
});
phantom.cookiesEnabled = true;
var x = require('casper').selectXPath;
casper.options.viewportSize = {width: 1920, height: 965};
casper.on('page.error', function(msg, trace) {
this.echo('Error: ' + msg, 'ERROR');
for(var i=0; i<trace.length; i++) {
var step = trace[i];
this.echo(' ' + step.file + ' (line ' + step.line + ')', 'ERROR');
}
});
var selector = ".table-component";
casper.waitForSelector(selector,
function success() {
console.log("table found");
console.log(document.querySelector(selector));
},
function fail() {
console.log("oops");
}
);
casper.run();
答
PhantomJS有两个背景和自CasperJS是建立在PhantomJS的顶部,它继承了这一事实。
您只能通过casper.evaluate()
(围绕page.evaluate()
包装)访问DOM。所有将选择器作为参数的CasperJS函数在内部使用evaluate()
。请注意0是沙盒,您只能传入和传出基本类型。 DOM元素不是原始类型,因此您无法将它们从页面(DOM)上下文中传递出去。你将不得不通过某种信息表示的要作为基本类型:
casper.waitForSelector(selector,
function success() {
this.echo("table found");
this.echo("1: "+this.evaluate(function(sel){
return !!document.querySelector(sel)
}, selector));
this.echo("2: "+this.evaluate(function(sel){
return document.querySelector(sel).textContent;
}, selector));
},
function fail() {
console.log("oops");
}
);
我建议你看看其他有用的功能,如casper.getElementInfo()
。
答
document.querySelector
在CasperJs中工作在DOM上下文中。要使用任何DOM请求,请使用casper.evaluate()
或this.evaluate
。此外,在评估函数范围外声明的变量需要以某种方式传递,如下所示。
var selector = ".table-component";
casper.waitForSelector(selector,
function success() {
console.log("table found");
var temp=this.evaluate(function(slctr){
return document.querySelector(selector);
},selector);
console.log(temp);
},
function fail() {
console.log("oops");
}
);