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

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