javascript - CasperJS:你如何点击所有选定的按钮？

Question

我正在尝试将 CasperJS 用作网络抓取工具，并且有一个带有按钮的页面，单击时将加载数据。所以，我想先点击所有这些按钮，然后等待，然后再实际进行查询以获取所有必要的数据。

问题是对于 Casper，casper.thenClick(selector) 点击第一个元素。但是如何根据选择器迭代和点击每个元素呢？

请注意，这些按钮没有 ID。它们都有通用类选择器。

例如

<h3>
    <span>Text 1</span>
    <span>
        <button class="load-btn">show</button>
    </span>
</h3>
<h3>
    <span>Text 2</span>
    <span>
        <button class="load-btn">show</button>
    </span>
</h3>
<h3>
    <span>Text 3</span>
    <span>
        <button class="load-btn">show</button>
    </span>
</h3>

由于某些原因 casper.thenClick("h3:contains('text 1') .load-btn") 不起作用。

Answer 1

我创建了一个新的“点击”功能，您可以使用for 循环点击每个元素:

function click(sel){var event=document.createEvent('MouseEvents');event.initMouseEvent('click',1,1,window,1,0,0,0,0,0,0,0,0,0,null);sel.dispatchEvent(event);}
var casper = require('casper').create({
    verbose: true,
    logLevel: 'debug',
    waitTimeout: 5000,
    userAgent: 'Mozilla/5.0 (X11; Linux x86_64; rv:49.0) Gecko/20100101 Firefox/49.0',
    viewportSize:{width: 1600, height: 900}
});
casper
.on("error", function(msg){ this.echo("error: " + msg, "ERROR") })
.on("page.error", function(msg, trace){ this.echo("Page Error: " + msg, "ERROR") })
.on("remote.message", function(msg){ this.echo("Info: " + msg, "INFO") })

.start("http://domu-test-2/node/12", function(){
    this.evaluate(function(click){
        var i, x = document.querySelectorAll("button.load-btn");
        for(i = 0; i < x.length; i++) {
            click(x[i]);
        } //'click' for each element
    }, click);
})
.run();

使用这个 HTML:

<h3>
    <span>Text 1</span>
    <span>
        <button class="load-btn" onclick='console.log("1")'>show</button>
    </span>
</h3>
<h3>
    <span>Text 2</span>
    <span>
        <button class="load-btn" onclick='console.log("2")'>show</button>
    </span>
</h3>
<h3>
    <span>Text 3</span>
    <span>
        <button class="load-btn" onclick='console.log("3")'>show</button>
    </span>
</h3>

将打印:

Info: 1
Info: 2
Info: 3

绿色。