jQuery在CasperJS的evaluate(）函数中没有做任何事情

jQuery isn't doing anything inside of CasperJS' evaluate() function

本文关键字：任何事 函数 CasperJS evaluate jQuery      更新时间：2023-09-26

我正在使用CasperJS从HTML数据中提取一些内容。为此，我在evaluate()函数中放置了一些jQuery代码，但是jQuery代码在那里不起作用。我不知道如何正确使用它。

我正在使用以下代码，示例：

var resultObj  =  [];
var casper = require('casper').create({
    pageSettings: {
       loadImages: false,
       loadPlugins: false,
       userAgent: 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1588.0 Safari/537.36'
    },
});
casper.start();
//another codes
casper.traverseHtml =   function(){
    var executer    =   casper.evaluate(function(){
        var htmlText    =   '<div><div class="tp">x</div><div class="tp">y</div><div class="tp">z</div><div class="tp">p</div></div>';
        object = $('<div/>').html(htmlText).contents();         
        object.find('.tp').each(function(index, element) {
            resultObj.push({value:index});
        });  
        return resultObj;
    });
    resultObj   =   executer;
}
casper.then(function() {
    casper.traverseHtml();
});
//codes
casper.run(function() {
    this.echo(JSON.stringify(resultObj)).exit();
});

我得到了这段代码的null结果，但是当我将traverseHtml函数替换为时，

casper.traverseHtml =   function(){
    var executer    =   casper.evaluate(function(){            
        return [{value:"1234"}];
    });
    resultObj   =   executer;
}

然后它给出输出为，

[{"value":"1234"}]

我不知道如何纠正这一点。

首先尝试将 jQuery 变量传递到评估函数中 - 可能是一个快速修复：

var executer    =   casper.evaluate(function($){

其次，验证远程页面是否具有 jQuery 并检查版本。 如果 jQuery 不存在，请注入（文档可在此处找到）：

var casper = require('casper').create({
    clientScripts: ["includes/jquery.min.js"]
});

如果使用旧版本的 jQuery，您可能需要在函数体中将"$"替换为"jQuery"。试试这个：

var executer    =   casper.evaluate(function($){
    var htmlText    =   '<div><div class="tp">x</div><div class="tp">y</div><div class="tp">z</div><div class="tp">p</div></div>';
    object = jQuery('<div/>').html(htmlText).contents();         
    object.find('.tp').each(function(index, element) {
        resultObj.push({value:index});
    });  
    return resultObj;
});

如果这些选项不起作用，请打开谷歌浏览器并在网页上的控制台中测试您的jQuery代码。

PhantomJS有两个上下文，由于CasperJS建立在PhantomJS之上，因此它具有相同的两个上下文。您可以通过casper.evaluate()访问页面/DOM 上下文，但它是沙盒化的。这意味着您无法访问在 casper.evaluate() 的回调函数之外定义的任何变量。你想在里面使用的所有内容都必须显式传入。有关详细信息，请参阅 PhantomJS 文档。

问题是您没有在页面上下文中定义resultObj，因此您无法将任何内容push到undefined引用上。

var executer = casper.evaluate(function(){
    var resultObj = []; // only additional line
    var htmlText = '<div><div class="tp">x</div><div class="tp">y</div><div class="tp">z</div><div class="tp">p</div></div>';
    var obj = $('<div/>').html(htmlText).contents();         
    obj.find('.tp').each(function(index, element) {
        resultObj.push({value:index});
    });  
    return resultObj;
});

我还object更改为局部变量obj。

如果页面没有提供 jQuery，你需要自己包含它：

var casper = require('casper').create({
    clientScripts: ["jquery.min.js"]
});

前提是您将jquery.min.js放在运行目录中。

如果你想看到隐藏在页面上下文中的实际错误，你可以侦听"page.error"事件：

casper.on("page.error", function(msg, trace) {
    this.echo("Error: " + msg, "ERROR");
});

还有更多有趣的事件：示例。

相关文章：