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

绿色。