Javascript 使用document.querySelectorAll通过CasperJS获取文本内容

我正在用CasperJS自动填写在线表单。当您试图提交表单时，如果您用无效数据填写了任何必填字段，则每个包含无效数据的字段都会显示一条错误消息，提醒您问题所在。我想收集所有这些消息并将它们连接成一个-无论是通过数组还是其他方法对我来说都无关紧要。错误消息的CSS如下所示：

<span class="field-validation-error" data-valmsg-replace="true" data-valmsg-for="Name.Last">
    <span class="" for="Name_Last" generated="true">
        The Last Name field is required.
    </span>
</span>

我开始在CasperJS中做同样的事情，但是我不能得到同样的结果。这是我到目前为止的代码（一个大得多的文件的片段，所以我不会发布我的

casper.start

或任何东西）：

var results=self.evaluate（函数（）{
var arr=document.querySelectorAll（“.field validation error”）；
返回Array.prototype.map.call（arr，函数（e）{
返回e.getAttribute（'textContent'）；
});
});
对于（var i=0；i

这将输出三个空行。

---

如果我只是

返回e

，然后

返回console.log（results[I].textContent））

，脚本确实正确地打印了一条错误消息，但随后崩溃，因为数组的其余部分都是空对象！我以为

Array.prototype.map

应该防止这种情况发生？如何通过Casper从该页面中获取错误消息数组？

您应该能够使用本机CasperJS函数实现这一点。它包含每个元素的

text

属性：

var texts = casper.getElementsInfo('.field-validation-error').map(function(info){
    return info.text.trim();
});

---

e.getAttribute（'textContent'）

显然无法工作，因为没有

textContent

属性，只有

textContent

属性。您在浏览器控制台中使用的代码应该在PhantomJS中工作。您可以尝试将

.textContent

更改为

.innerText

节点。属性没有相关属性。直接访问该属性：

return Array.prototype.map.call(arr, function(e) {
    return e.textContent;
});

returnarray.prototype.map.call（arr，function（e））{
返回e.textContent；
});
无论出于何种原因，您访问了第一个示例中的属性，并在第二个示例中查找属性

"The Last Name field is required."
"The City field is required."

var results = self.evaluate(function() {
    var arr =  document.querySelectorAll('.field-validation-error');
    return Array.prototype.map.call(arr, function(e) {
        return e.getAttribute('textContent');
    });
});

for (var i = 0; i < results.length; i++) {
     console.log(results[i]);
}

var texts = casper.getElementsInfo('.field-validation-error').map(function(info){
    return info.text.trim();
});

return Array.prototype.map.call(arr, function(e) {
    return e.textContent;
});