Question

我想使用CasperJS获取有关对象的属性，例如我有类似的东西：

var casper = require('casper').create();
casper.start('http://www.seznam.cz', function() {
    if (this.exists('div#info')) {
        require('utils').dump(this.getElementInfo('div#info'));
    } 
    else {
        this.echo(' not found', 'ERROR');
    }
});
casper.run();

我可以在控制台中看到许多属性，例如元素的位置。现在给出这个，是否有可能获得这些坐标并执行例如this.click(coordinates)？如果是的话，怎么样？

我也想知道其他属性，例如parentNode，childNodes。

Answer 1

我可以在控制台中看到许多属性，例如元素的位置。现在给出这个，是否有可能获得这些坐标并执行例如this.click(coordinates)？如果是，怎么样？

像casper.getElementInfo(selector)这样的函数提供给定选择器匹配的第一个元素的坐标和尺寸。如果CasperJS没有能力使用它们，那就太奇怪了。

CasperJS有多个模块可以完成不同的任务。其中之一是mouse module。这个模块提供了一个click()函数，它可以选择一个选择器，也可以点击某个坐标。

casper.then(function(){
    var info = this.getElementInfo('div#info');
    this.mouse.click(info.x+1, info.y+1);
});

+1是必要的，以便实际点击元素而不是其边框。

我也想知道其他属性，例如parentNode，childNodes。

这要困难得多。 CasperJS（和PhantomJS）有两种情境。外部上下文是脚本中的代码，但不完全。 casper.evaluate()是进入沙盒页面上下文的窗口。

传递给casper.evaluate()的函数无法访问外部定义的变量。必须明确传递值。它们将在整个过程中被序列化为JSON。因此，当您想要将DOM节点传递出页面上下文时，它们将失去意义，因为它们不是JSON可序列化的。

另一方面，您可以做的是永远不会传递您在外面调用parentNode或childNodes时获得的DOM节点。仅在页面上下文中完全使用它们。将它们存储在全局window对象中以供稍后使用，然后在脚本中稍后使用另一个casper.evaluate()来访问它们。

如果您实际上不需要实际节点，则可以检索这些节点的表示。 textContent是一个很好的候选人：

var childContentsArray = casper.evaluate(function(){
    return [].map.call(document.querySelector("#someId").childNodes, function(child){
        return child.textContent;
    });
});

如何基于坐标单击元素以及如何使用CasperJS检索元素属性？

1 个答案: