Javascript 创建即将到来的页面时，倒计时计时器不工作_Javascript_Html

Javascript 创建即将到来的页面时，倒计时计时器不工作

javascript html

Javascript 创建即将到来的页面时，倒计时计时器不工作,javascript,html,Javascript,Html,我正试图显示一个即将到来的网页倒计时计时器。除了用javascript编写的计时器外，一切正常。我还尝试将其设置为外部文件。当进行外部设置时，它也会读取文件，但计时器不会显示在页面上这是我的刀锉 <!doctype html> <html> <head> <meta charset="UTF-8"> <title> Coming Soon</title> <link rel="stylesheet" type="te

我正试图显示一个即将到来的网页倒计时计时器。除了用javascript编写的计时器外，一切正常。我还尝试将其设置为外部文件。当进行外部设置时，它也会读取文件，但计时器不会显示在页面上

这是我的刀锉

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title> Coming Soon</title>
<link rel="stylesheet" type="text/css" href="{{asset('css/style.css')}}">
<link href="https://fonts.googleapis.com/css2?family=Balsamiq+Sans:ital@1&family=Montserrat&family=Open+Sans+Condensed:wght@300&family=Playfair+Display&display=swap" rel="stylesheet">
</head>
<body>

<header>
    <div class="soon">
        <p> We will be back with beautiful website</p>
    <h1>COMING SOON</h1>

    <hr>
    <p id="launch"></p>
</header>

<script>
var date = new Date("Jan 1, 2020 00:00:00").getTime();
    var countdownfunction = setInterval(function() {
      var today = new Date().getTime();
      var distance = date - today;  
      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);

      document.getElementById("demo").innerHTML = days + "d " + hours + "h "
      + minutes + "m " + seconds + "s ";

      if (distance < 0) {
        clearInterval(countdownfunction);
        document.getElementById("demo").innerHTML = "EXPIRED";
      }
    }, 1000);
</script>

    </body>
</html>

将html代码上的

更改为

，

或者将脚本代码上的

document.getElementById（“demo”）

更改为

document.getElementById（“launch”）

，您必须添加一个id为demo的标签，如div 而且你未来的约会是错误的

<header>
    <div class="soon">
        <p> We will be back with beautiful website</p>
    <h1>COMING SOON</h1>

    <hr>
    <div id=demo></div>div>
    <p id="launch"></p>
</header>

你说它不工作是什么意思？网页上没有显示倒计时计时器控制台中有任何错误？是的。。。错误为“Uncaught TypeError:无法设置属性'innerHTML'的空错误“on code”document.getElementById（“demo”）。innerHTML=days+“d”+hours+“h”查看您的代码，日期是

1月1日

，您的日期已经过期。没有演示id，只有

launch

。你看不到任何东西，因为你不懂代码。不要只是在网上复制粘贴任何东西

<header>
    <div class="soon">
        <p> We will be back with beautiful website</p>
    <h1>COMING SOON</h1>

    <hr>
    <div id=demo></div>div>
    <p id="launch"></p>
</header>

var date = new Date("Jan 1, 2021 00:00:00").getTime();