Question

刚开始学习CasperJS，我知道我可以使用以下内容来获取选项的文本：

var casper = require('casper').create();
casper.start('http://www.example.com/test.aspx', function() {
  this.evaluate(function () {
    this.echo("Values: " + this.fetchText('#mySelect'));
  });
});
casper.run(function () {
    this.exit();
});

其中mySelect是页面中的<select>。示例HTML如下：

<select id="mySelect">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

我的目标是从mySelect获取值（1,2和3）。我怎样才能在CasperJS中做到这一点？我尝试了以下代码，但没有显示任何内容：

this.evaluate(function() {
    var options = document.getElementById("mySelect").children;
    for(var i = 0; i < options.length; i++) {
        this.echo('Options: ' + options[i]);
    }
});

经过一些调试后，options为undefined。

Answer 1

casper.evaluate与PhantomJS基本相同＆＃39; page.evaluate（我将两者联系在一起，因此您可以仔细阅读）。它是沙盒页面上下文。来自外部的变量不在那里，this指的是window。我怀疑该页面具有全局函数echo和fetchText。

请注意，无法从页面上下文传递DOM元素。您将需要构建如下表示：

var options = this.evaluate(function() {
    var options = document.getElementById("mySelect").children;
    return [].map.call(options, function(opt){
        return {val: opt.value, text: opt.textContent};
    });
});

或只是

var options = this.getElementsInfo('#mySelect > option');

从CasperJS的下拉框中获取选项值

1 个答案: