Как в js сделать чтобы автоматическое добавление чисел

Есть кликер при нажатии все добавляеться, но было бы лучше если со временем очки росли.



var score = 0;

function clickBtn() {
 score++;
 console.log(score);
 document.getElementsByTagName("p")[0].firstChild.data = "Clicks: " + score;
}

function loadPage() {
 $("#background").animate({}, 800, function() {
   $("#clickbtn").animate({height: "250px", width: "250px"}, 850, function() {
     $("#clickbtn").animate({fontSize: "45px"}, 850, function() {
     $("#score").animate({fontSize: "40px"}, 850, function() {
     })
     })
   })
 })
}

Ответы (1 шт):

Автор решения: shutdown

Можно использовать setTimeout.

var score = 0;

function clickBtn() {
  score++;
  console.log(score);
  document.getElementsByTagName("p")[0].firstChild.data = "Clicks: " + score;
}

function loadPage() {
  $("#background").animate({}, 800, function() {
    $("#clickbtn").animate({
      height: "250px",
      width: "250px"
    }, 850, function() {
      $("#clickbtn").animate({
        fontSize: "45px"
      }, 850, function() {
        $("#score").animate({
          fontSize: "40px"
        }, 850, function() {})
      })
    })
  })

  setTimeout(function increaser() {
    score++;
    document.getElementsByTagName("p")[0].firstChild.data = "Clicks: " + score;
    setTimeout(increaser, 1500);
  }, 1500);
}

loadPage();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="background" style="height:500px;">
  <button id="clickbtn" onclick="clickBtn();">Click me!</button>
  <br>
  <p id="score">0</p>
</div>

→ Ссылка