Question

在过去的几个小时里，我一直在尝试查询DOM元素并将它们存储在一个带有CasperJS的数组中，然后我可以遍历它们并触发一个点击事件。

让我们说，我的标记是这样的：

<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ul>

现在，我想将每个<li>存储一个数组，然后循环，触发Click事件，然后进行捕获。

这是我尝试过的事情之一：

var listItems = [];

casper.start();

casper.open(urlHere, function () {
    listItems.push(this.evaluate(function () {
        return document.querySelectorAll('ul > li');
    }));

    this.echo(listItems);
});

它返回[ , , , ]，这基本上意味着它们都是null。

有人可以指导我朝正确的方向发展吗？

谢谢！

Answer 1

试试这个：

var listItems = [];

casper.start(urlHere, function () {
    listItems = this.evaluate(function () {
        var nodes = document.querySelectorAll('ul > li');
        return [].map.call(nodes, function(node) {
            return node.textContent;
        });
    });

    this.echo(listItems);
});

基本上，您无法返回this.evaluate()中不可序列化的值，而是文档中的well explained。

Answer 2

我对CasperJS一无所知，但是一个数组被认为是JavaScript中的一个对象，所以一个数组会有一个Object类型。您是否尝试使用for循环遍历它？

var i;
for(i=0;i<listItems.length;i++) {
    var item = listItems[i];
}

或者，如果您有一个包含列表项对象的实际对象，则可以执行以下操作：

for(i in listItems) {
    if(listItems.hasOwnProperty(i)) { 
        var item = listItems[i];
    }
}

编辑：这只是为了检查您是否确实拥有包含项目的有效数组。

使用CasperJS将多个DOM元素存储在数组中

2 个答案: