почему в моем браузере не отображается предупреждение?

Question

Я создал код для часов обратного отсчета до Олимпиады в Токио-2020, и я хочу, чтобы результаты появлялись в предупреждении, однако я не могу его отобразить. Может кто-нибудь помочь мне решить эту проблему?

    <script>
    // Set the date we're counting down to
    var countDownDate = new Date("July 24, 2020 00:00:00").getTime();

    // Update the count down every 1 second
    var x = setInterval(function() {

        // Get todays date and time
        var now = new Date().getTime();

        // Find the distance between now and the count down date
        var distance = countDownDate - now;

        // Time calculations for days, hours, minutes and seconds
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

        // Display the result in the element with id="demo"
        document.getElementById("demo").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

        // If the count down is finished, write some text 
        if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "EXPIRED";
        }
        }, 1000);

        //alerting the clock
        alert(days + hours + minutes + seconds);

Answer 1

Вы просто вызываете оповещение один раз, если размещаете его вне функции интервала:

// Set the date we're counting down to
var countDownDate = new Date("July 24, 2020 00:00:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("demo").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

  // If the count down is finished, write some text 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }

  alert(`${days} days, ${hours} hours, ${minutes} minutes,  ${seconds} seconds until the Tokyo 2020 Olympics`); // this jquery notation makes it easier to write strings depending on variables
  //alert(days + " days, " + hours + " hours, " +  minutes + " minutes, " + seconds + " seconds, until the Tokyo 2020 Olympics");
}, 10000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="demo"></p>

Answer 2

Вам нужно поместить предупреждение внутри функции интервала, если вы хотите, чтобы оно повторялось (я изменил приведенный ниже код, чтобы показать основные элементы того, что вы хотите):

var countDownDate = new Date("July 24, 2020 00:00:00").getTime();

var x = setInterval(function() {
  var now = new Date().getTime();
  var distance = countDownDate - now;
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  if (distance < 0) {
    clearInterval(x);
  }
  alert(`${days}${hours}${minutes}${seconds}`);
}, 1000);