JavaScript實現倒計時


JavaScript實現倒計時

利用JS中的Date對象即可實現,創建目標時間和當前時間,利用getTime函數將兩個時間轉換成距離1970-01-01的秒數,相減后轉化為年月日即可

js代碼

<script>
    window.onload = function() {
        setInterval(function() {
            var nowTime = new Date();//獲取當前時間
            //創建目標日期
            var endTime = new Date("2019-9-1 00:00:00");
            var seconds = parseInt((endTime.getTime() - nowTime.getTime()) / 1000);//兩個時間點的時間差(秒)
            var d = parseInt(seconds / 3600 / 24);//得到天數
            var h = parseInt(seconds / 3600 % 24);//小時
            var m = parseInt(seconds / 60 % 60);//分鍾
            var s = parseInt(seconds % 60);//秒
            document.getElementById("djs").innerHTML = "距離開學還有" + d +"天" + h + "小時" + m + "分鍾" + s + "秒";
        }, 1000);
    }
</script>

HTML及樣式

<!DOCTYPE html>
<html>
<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">
    <title>Document</title>
    <style>
        p {
            font-size: 24px;
            color: red;
            border: 1px solid red;
            text-align: center;
            width: 600px;
            margin: 20% auto;
            line-height: 50px;
        }
    </style>
</head>
<body>
    <p id="djs"></p>
</body>
</html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM