Loop in Javascript to click button

Question

I am using the console to click a button with the following code:

document.getElementById('meubotao').click();

I’d like to make one loop for and let Javascript click the button a 100 times, but every time the page reloads gives error.

How do I keep the console script even with the page update (SPA)?

Observing: I’m only using the console, I don’t have access to the source code. I just want to make my job easier and not keep clicking the button.

Answer 1

I believe that to achieve the behavior you need could use the function setInterval instead of a for. Try to give 1 second interval in each click so that the page can process (1 second is expressed per 1000 milliseconds in the function below)

setInterval( function(){ document.querySelector('#meubotao').click();}, 1000);

Answer 2

I’m not sure I understand, but you want to programmatically fire 100 clicks on a button third party pages.

If it is I will give a specific answer for Chrome because Chrome is the most common browser and has the console in the Developer Tools option, tool that allows modifying the current page.

Load the tab you want to generate clicks on.

Press [Ctrl] + [Shift] + I to open Developer Tools.

In the menu bar select the option Elementos and discover the attribute id button you want to install click generator.

If the button does not have the attribute id I’m sorry but you’ll have to click 100.

Holding the 'id' attribute go back to the menu bar and select the option Console.

In the console create a function to trigger event programmatically. In this example the function is called DispararEvento accepting a page element and the name of an event.

    function DispararEvento( elemento , evento ) {
        var eventoDOM = new Event( evento ); // Cria o evento
        elemento.dispatchEvent( eventoDOM );    // Despacha o evento.
    }

The logic is to take the concrete by id and create a loop that itere 100 times using the function DispararEvento to fire the 100 clicks.

   function loop(){
       for(var i = 0; i < 100; i++){
            DispararEvento(document.getElementById(/*Aqui vai o id do botão alvo*/), "click");
       }
  }

Then just create a button on the page that clicked invoke the loop function.

document.body.innerHtml += '</input><button onclick="loop();">Clicar em loop</button>';

Close the developer tools and click on the new button you created and 100 click will be fired against the target button.

---

A simple example gives logic involved, I created a input and two buttons one of them is the target(id='add') that adds 1 to the value of input and another button fires 100 clicks.

<script>
    // Essa função apenas soma 1 ao resultado
    function incrementar(){
      document.getElementById("resultado").value = parseInt(document.getElementById("resultado").value) + 1;
   
    }

    // Chama 100x a função DispararEvento
    function loop(){
        for(var i = 0; i < 100; i++){
             DispararEvento(document.getElementById("somar"), "click");
        }
    }
    
    // Dispara um evento contra um alvo
    function DispararEvento( elemento , evento ) {
        var eventoDOM = new Event( evento ); // Cria o evento
        elemento.dispatchEvent( eventoDOM );    // Despacha o evento.
    }
</script>
    <input id="resultado" type="number" value="0"></input><button id="somar" onclick="incrementar();">Somar 1</button>
    </p>
    </input><button onclick="loop();">Somar em loop</button>