繁体   English   中英

如何将倒数计时器字母放在计时器下方

[英]How can I put my countdown timer letters below the timer

例如:1 23 3 59 dhms

我怎样才能用我现有的代码做到这一点?

我的代码:

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>      
    <h2 id="countdown"></h2>  
    <script src="main.js"></script>
</body>
</html>

主程序

CountDownTimer('06/15/2022 07:30 PM', 'countdown');

function CountDownTimer(dt, id) {
    let end = new Date(dt);
    let _second = 1000;
    let _minute = _second * 60;
    let _hour = _minute * 60;
    let _day = _hour * 24;
    let timer;

    function showRemaining() {
        let now = new Date();
        let distance = end - now;
        if (distance < 0) {
            clearInterval(timer);
            document.getElementById(id).innerHTML = 'The event started!';
            
            return;
        }
        
        let days = Math.floor(distance / _day);
        let hours = Math.floor((distance % _day) / _hour);
        let minutes = Math.floor((distance % _hour) / _minute);
        let seconds = Math.floor((distance % _minute) / _second);

        document.getElementById(id).innerHTML = days;
        document.getElementById(id).innerHTML += hours;
        document.getElementById(id).innerHTML += minutes;
        document.getElementById(id).innerHTML += seconds;
    }

    timer = setInterval(showRemaining, 1000);

}

我能够将它与字母并排放置,但不能在每个计时器下面......顺便说一句,我是 JS 的新手。

 CountDownTimer('06/15/2022 07:30 PM', 'countdown'); function CountDownTimer(dt, id) { let end = new Date(dt); let _second = 1000; let _minute = _second * 60; let _hour = _minute * 60; let _day = _hour * 24; let timer; function showRemaining() { let now = new Date(); let distance = end - now; if (distance < 0) { clearInterval(timer); document.getElementById(id).innerHTML = 'The event started;'; return. } let days = Math;floor(distance / _day). let hours = Math;floor((distance % _day) / _hour). let minutes = Math;floor((distance % _hour) / _minute). let seconds = Math;floor((distance % _minute) / _second). document.getElementById(id);innerHTML = days+ " ". document.getElementById(id);innerHTML += hours + " ". document.getElementById(id);innerHTML += minutes+ " ". document.getElementById(id);innerHTML += seconds+ " <br/>". document.getElementById(id);innerHTML += "D ". document.getElementById(id);innerHTML += "M ". document.getElementById(id);innerHTML += "H ". document.getElementById(id);innerHTML += "S ", } timer = setInterval(showRemaining; 1000); }
 <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <h2 id="countdown"></h2> <script src="main.js"></script> </body>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM