2016-12-01 8 views
9

Ich versuche, CasperJS als Web-Scraper zu verwenden, und es gibt eine Seite mit Schaltflächen, die beim Klicken Daten laden. Also möchte ich zuerst auf alle diese Schaltflächen klicken und warten, bevor ich eine Abfrage mache, um alle notwendigen Daten zu erfassen.CasperJS: Wie klicken Sie auf alle ausgewählten Schaltflächen?

Das Problem ist, dass mit Casper casper.thenClick(selector) das erste Element klickt. Aber wie iterieren Sie und klicken Sie auf jedes Element basierend auf dem Selektor?

Beachten Sie, dass diese Tasten keine IDs haben. Sie haben alle generische Klassenselektoren.

Ex.

<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> 

Und aus irgendeinem Grund casper.thenClick("h3:contains('text 1') .load-btn") funktioniert nicht.

Antwort

4

ich eine neue 'Klick' Funktion erstellt haben, können Sie auf jedem Element klicken durch for Zyklus mit:

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(); 

Mit diesem 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> 

druckt:

Info: 1 
Info: 2 
Info: 3 

In grüner Farbe.

+2

Sie geben die 'click' Funktion aus dem äußeren Kontext in der Seite verwendet wird. Dies funktionierte nicht mit PhantomJS 1.x. Hat sich das geändert? Ich wäre sehr überrascht, wenn das wirklich so funktioniert, wie Sie es beschreiben. –

+1

Ich habe es wieder getestet, alles funktioniert gut, PhantomJS Version: 2.1.1 –

2

Sie könnten versuchen, in das DOM zu fallen, indem Sie stattdessen evaluate verwenden (ich nehme an, die Seite hat jquery darauf).

casper.thenEvaluate(function() { 
    $('button.load-btn').click(); 
}); 

Denken Sie daran, dass Sie WAIT benötigt für etwas später zu erscheinen.

casper.wait(2000, function() {...}); 

oder einen Kontext waitFor function

Verwandte Themen