使用casper.evaluate函数时的差异

时间:2015-02-12 10:58:54

标签: javascript function casperjs

我使用的是PhantomJS v2.0和CasperJS 1.1.0-beta3。我想查询页面DOM中的特定部分。

这里的代码不起作用:

function myfunc()
{
    return document.querySelector('span[style="color:#50aa50;"]').innerText;    
}
var del=this.evaluate(myfunc());

this.echo("value: " + del);

这里的代码确实有效:

var del=this.evaluate(function() 
{
   return document.querySelector('span[style="color:#50aa50;"]').innerText; 
});

this.echo("value: " + del);

它似乎是一样的,但它的工作方式不同,我不明白。

这里的代码也有效:

function myfunc()
{
    return document.querySelector('span[style="color:#50aa50;"]').innerText;    
}
var del=this.evaluate(myfunc);

this.echo("value: " + del);

这里的区别是,我在没有'()'的情况下调用myfunc。

任何人都可以解释原因吗?

1 个答案:

答案 0 :(得分:0)

问题在于:

var text = this.evaluate(myfunc());

JavaScript中的函数是一等公民。您可以将它们传递给其他函数。但那不是你在这里做的。您调用该函数并将结果传递给evaluate,但结果不是函数。

此外,casper.evaluate()是页面上下文,只有页面上下文才能访问该文档。在执行()之前调用函数(casper.evaluate())本质上时,如果不可能,则会错误地尝试访问该文档。

casper.evaluate(function(){...});的区别在于匿名函数已定义并传递到evaluate()函数。

有些情况下应该调用函数而不是传递函数。例如,当currying完成时,但这不适用于casper.evaluate(),因为它是沙箱,并且最终在casper.evaluate()中运行的函数不能使用来自外部的变量。它必须是自包含的。因此,以下代码也无效

function myFunc2(a){
    return function(){
        // a is from outer scope so it will be inaccessible in `evaluate`
        return a;
    };
}
casper.echo(casper.evaluate(myFunc2("asd"))); // null

你应该使用

var text = this.evaluate(myfunc);

传递先前定义的函数以在页面上下文中运行。

使用del之类的保留关键字作为变量名称也不是一个好主意。