javascripthtmlcssauto-incrementrequests-per-second

How to increment a String value by 1 each second JS


I have a value var x = "2". How can I increment x each second so that one second from when I defined x, x will equal to 3?

My code is shown bellow:

<img src="cookie.jpg" style="text-align:center; width:250px;" id="cookie" onclick="Click()">
<h1 id="score">0</h1>
<script>
  var cookie = document.getElementById("cookie");
  function Click() {
    var scoreStr = document.getElementById("score");
    var score = parseInt(scoreStr.textContent);
    score ++;
    scoreStr.textContent = score;
  }
</script>

Solution

  • Use a setInterval and set it to one second => 1000

    let display = document.getElementById('display')
    let x = display.textContent;
    // textContent returns a string value
    
    setInterval(()=>{
      // lets change the string value into an integer using parseInt()
      // parseInt would not be needed if the value of x was `typeof` integer already
      display.textContent = parseInt(x++)
    }, 1000)
    <div id="display">2</div>