Javascript倒计时问题

Question

这是我的第一个主题，所以我不确定我写的是正确的部分等等，但我遇到了一个非常简单的问题，这迫使我写到这里寻求帮助。我已经编写了一些代码来创建倒计时，显示到特定日期还剩多少时间。然而有些东西不起作用。我会添加我的 html 和 JS 代码，如果有人能找到缺陷，我将不胜感激。

function countdown() {
  var now = new Date();
  var eventDate = new Date(2020, 10, 10);
  var currentTime = now.getTime();
  var eventTime = eventDate.getTime();
  var remTime = eventTime - currentTime;
  var s = Math.floor(remTime / 1000);
  var m = Math.floor(s / 60);
  var h = Math.floor(m / 60);
  var d = Math.floor(h / 24);
  h %= 24;
  m %= 60;
  s %= 60;
  if (h < 10) {
    h = "0" + h;
  }
  if (m < 10) {
    m = "0" + m;
  }
  s = (s < 10) ? "0" + s : s;
  document.getElementById("days").textContent = d;
  document.getElementById("days").innerText = d;

  document.getElementById("hours").textContent = h;
  document.getElementById("minutes").textContent = m;
  document.getElementById("seconds").textContent = s;
  setTimeout(countdown, 1000);
}

<pre>
    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/font-awesome.min.css">
    <link rel="stylesheet" href="./css/laikmatis.css">
    <link rel="stylesheet" href="./css/main.css">
    <title>Puslapis</title>
</head>
<body>
    <section>
        <main>
            <h1 class="text1">rgrgrgrgrg</h1>
            <h2 class="text2">rrgrfgrfgvrfgvrfgv</h2>
            <span class="text1">dvbgtbrtfbrfb</span>
            <table>
                <div id="laikmatis">
                    <tr>
                        <td id="days">120</td>
                        <td id="hours">20</td>
                        <td id="minutes">20</td>
                        <td id="seconds">20</td>
                    </tr>
                    <tr>
                        <td>Days</td>
                        <td>Hours</td>
                        <td>Minutes</td>
                        <td>Seconds</td>
                    </tr>
                </div>
            </table>
            <script src="./JS/laikmatis.js"></script>
            <p class="text2">efefefefeeeeeeeeeeeeeeeeefefefe e fef efe fefefef ef ef efe fef ef ef efe ef ef ef ef </p>
        </main>
    </section>
</body>
</html>
</pre>

Answer 1

您忘记调用函数了

countdown();

function countdown() {
  var now = new Date();
  var eventDate = new Date(2020, 10, 10);
  var currentTime = now.getTime();
  var eventTime = eventDate.getTime();
  var remTime = eventTime - currentTime;
  var s = Math.floor(remTime / 1000);
  var m = Math.floor(s / 60);
  var h = Math.floor(m / 60);
  var d = Math.floor(h / 24);
  h %= 24;
  m %= 60;
  s %= 60;
  if (h < 10) {
    h = "0" + h;
  }
  if (m < 10) {
    m = "0" + m;
  }
  s = (s < 10) ? "0" + s : s;
  document.getElementById("days").textContent = d;
  document.getElementById("days").innerText = d;

  document.getElementById("hours").textContent = h;
  document.getElementById("minutes").textContent = m;
  document.getElementById("seconds").textContent = s;
  setTimeout(countdown, 1000);
}

countdown();

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/font-awesome.min.css">
    <link rel="stylesheet" href="./css/laikmatis.css">
    <link rel="stylesheet" href="./css/main.css">
    <title>Puslapis</title>
</head>
<body>
    <section>
        <main>
            <h1 class="text1">rgrgrgrgrg</h1>
            <h2 class="text2">rrgrfgrfgvrfgvrfgv</h2>
            <span class="text1">dvbgtbrtfbrfb</span>
            <table>
                <div id="laikmatis">
                    <tr>
                        <td id="days">120</td>
                        <td id="hours">20</td>
                        <td id="minutes">20</td>
                        <td id="seconds">20</td>
                    </tr>
                    <tr>
                        <td>Days</td>
                        <td>Hours</td>
                        <td>Minutes</td>
                        <td>Seconds</td>
                    </tr>
                </div>
            </table>
            <script src="./JS/laikmatis.js"></script>
            <p class="text2">efefefefeeeeeeeeeeeeeeeeefefefe e fef efe fefefef ef ef efe fef ef ef efe ef ef ef ef </p>
        </main>
    </section>
</body>
</html>

Javascript倒计时问题

Javascript Countdown issue

javascript

countdown