倒数并使用JavaScript重置计数

如何解决倒数并使用JavaScript重置计数

我想在我的网站上显示倒计时。对于所有用户，但我不想使用任何后端语言。 倒数从$my-theme: mat-light-theme($my-primary,$my-accent,$my-warn) 开始，在每个20之后，我将数字减少1min。表示在1之后，该值将为2mins，并且在达到18时，该数字应重置为3。我使用时差来进行正确倒计时，但无法进行重置。我有两个功能

20

第二个将毫秒转换为分钟

function change_html() {
  var start_number = 20;
  var start = new Date("November 11,2020 00:00:00"); // This will get the all milisec
  var end = new Date(); // This will get the all milisec of current
  var final = (get_difference(start,end)); // This will return all the mins passed
  var new_start = (final/20); // This will get how many 20 are passed
  var new_final = new_start.toString();
  new_final = new_final.split(".");
  var final_to_show = new_start-parseInt(new_final[0]);
  final_to_show = final_to_show*20; // This will get how many numbers are remain to complete 20
  final_to_show = Math.round(((20)-final_to_show));
  document.getElementById('html_element').innerHTML = final_to_show;
}

我不想在重新加载时重置倒数计时，循环是无穷尽的。 我不知道该怎么办，因为它不是基于任何静态值，而是将在jQuery和Javascript中完成。请帮我解决这个问题，或者建议我用另一种方法来做。

解决方法

您只需要使用setInterval method
最复杂的方法是将您的倒计时设置为17分钟，以3分作为偏移，首先是20点开始。
...并且您应该了解modulo works in math

const showElement = document.getElementById('html_element'),one_Sec     = 1000,one_Min     = one_Sec * 60,countMax    = 20,countMin    = 3,countRange  = countMax - countMin +1,startDateT  = (new Date("November 11,2020 00:00:00")).getTime(),timeNowDiff = () => Math.floor(Math.abs(((new Date()).getTime() -startDateT) / one_Min ))
    ;
showElement.textContent =  countMax -(timeNowDiff() % countRange)
setInterval(()=>
  {
  showElement.textContent = countMax -(timeNowDiff() % countRange)
  },one_Sec *10); //  check display change every 10 seconds....

changing every minutes : <span id="html_element" style="color:red"></span> until 3