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"); 
    } 
);