Progressive counting using for

Asked

Viewed 596 times

-1

If I do this one:

for (var i = 0; i < 9; i++) {
  document.write(i);
}

The result will be: 123456789

How do I stop instead of being like this: 123456789, it create a count with a single numeral?

Type a progressive count.

javascript for
  • 2

    What is "a counting with a single numeral"?

  • This was difficult to explain. You know when we type here and show how many characters are missing? " N remaining characters" in Box, that N, would be "A numeral only".

  • You want it to print: 9999999999 - or you want it to run the loop 10 times, but the last time it writes: 9? Or neither of the two?

  • It just got worse, now I have no idea what you’re talking about, this comment doesn’t seem to indicate anything related to what’s in the question.

  • see if this is what you want... http://jsfiddle.net/hqh6Lne9/

  • Look at my edition. There’s only one number, right? It just goes down.

Show 1 more comment

4 answers

2


You can pass arguments to the function:

var span = document.querySelector('span');

for (var i = 0; i < 10; i++) {
  setTimeout(function(a) {    
    span.innerHTML = a;    
  }, i * 1000, i);
}
<span></span>

The method setTimeout() takes as arguments a function to be executed after the time expires, in which case it is function(a).

The time, in Milliseconds, that the method will wait before performing the function, which in this case is i * 1000 - i * 1000 because with each iteration the timer var wait a different time (one more second each call). 1000 Milliseconds is equal to 1 second, in which case the timer will display the counter with 1 second interval.

And finally, the method accepts parameters, how many you need, that can be used in the internal function - in this case the parameter a function will have the value of the last parameter in , i * 1000, i);

  • Always present the anonymous downvotes :p

  • Also do not know the reason for downvote for you, It was the best response to my view. no case, had downvote for all, I did not understand.

  • Can you explain this ending to me, Lucas? i * 1000, i

  • Of course @Lucascarvalho, I edited the answer, if it was not very clear ask here

  • No, the i * 1000 I understood, I just didn’t understand the ,i (comma i) kk

  • 1

    This will be the parameters that can be used in the function.

  • I get it. Thank you! :)

Show 2 more comments

0

Lucas, If the program runs on the console it follows a running pattern and prints everything you send, not enabling a clear, but there is a gambiarra. The "solution" is to use the console.clear(), only that the problem lies in the difference of running from browser to browser, as points out that page of MDN.

If for a textarea or div:

var i = 0;
theLabel = document.getElementById("minhaDiv");
var interval = setInterval(function(){ 
    if (i == 100) clearInterval(interval);
    theLabel.innerHTML = i; 
    i++;
}, 
1000);

-1

        var i = 10;
theLabel = document.getElementById("counter");
var interval = setInterval(function(){ 
    
    theLabel.innerHTML = i; 
    i--;
}, 
1000);
<div id="counter"></div>

  • I would like to understand why they gave -1 in my answer if it is valid?

  • I don’t know what was the reason for the negative but it always leaves a brief description of how the code works. Answers with code only sometimes end up falling in the revision queue.

-2

Hello Voce has to put your counter in a div and go changing it over time

for (var i = 0; i < 9; i++) {
    document.getElementById("demo").innerHTML=i
}
<div id="demo">
</div>

But I believe that a spinner is a better solution than this.

.loader {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
<div id="demo" class="loader"></div>

Then you put in a timeout. I think it’s to show the page load that you want I’m not putting all the code but if that’s what you want I’ll go back.

Browser other questions tagged javascript for

You are not signed in. Login or sign up in order to post.