Share Code Đếm Ngược Thời Gian – Bao nhiêu ngày nữa đến tết

Để tạo một trang HTML với chức năng hiển thị thời gian đếm ngược, bạn có thể sử dụng JavaScript để tính toán và hiển thị thời gian đếm ngược trên trang web của mình. Dưới đây là một ví dụ đơn giản cho code đếm ngược thời gian:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Bao nhiêu ngày nữa đến tết</title>
    </head>
    <body>
        <div id="countdown" style="text-align: center; font-size: 25px;"></div>

        <script>
            const targetDate = new Date("2024-05-26T00:00:00Z");

            function countdown() {
                const now = new Date();
                const diff = targetDate - now;

                const days = Math.floor(diff / (1000 * 60 * 60 * 24));
                const hours = Math.floor((diff / (1000 * 60 * 60)) % 24);
                const minutes = Math.floor((diff / 1000 / 60) % 60);
                const seconds = Math.floor((diff / 1000) % 60);

                document.getElementById("countdown").innerHTML = `${days} ngày ${hours} giờ ${minutes} phút ${seconds} giây`;

                setTimeout(countdown, 1000);
            }

            countdown();
        </script>
    </body>
</html>

Trong ví dụ này, chúng ta sử dụng hàm countdown() để tính toán thời gian đếm ngược từ thời điểm hiện tại đến một thời điểm đích được đặt sẵn (ở đây là 00:00:00 ngày 1 tháng 1 năm 2024, theo múi giờ UTC). Sau đó, chúng ta sử dụng phương thức getElementById() để thêm nội dung thời gian đếm ngược vào phần tử <h1> trong trang HTML, và sử dụng phương thức setTimeout() để cập nhật thời gian đếm ngược sau mỗi 1 giây. Bạn có thể thay đổi thời gian đích và định dạng hiển thị thời gian đếm ngược theo ý của mình.

Cảm ơn các bạn đã ghé thăm Sharecs.net. Chúc các bạn thành công!