Javascript定時器-有解無憂

一次性定時器：setTimeout(fun,time)；回呼函式等待time時間后，執行一次！

引數：fun：需要執行的回呼函式/time等待的時間

永久定時器：setInterval(fun,time)；回呼函式每隔time時間后，執行一次！

引數：fun：需要執行的回呼函式/間隔的時間/time間隔的時間

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>定時器</title>
        <style>
            span {
                height: 30px;
                display: inline-block;
                border-color: #333;
            }
            h1 {
                vertical-align: middle;
            }
        </style>
    </head>
    <body>
        <h1>
            距離下次休假還有<span id="time"></span>
        </h1>
        <script>
            var finalDate=new Date("2020/1/1 00:00");    //計時結束的時間點
            function getTime() {
                var nowDate=new Date();    //程式開始運行的時間點
                console.log(finalDate-nowDate);    //獲取結束時間到當前時間的毫秒數
                var ms=finalDate-nowDate;    //從程式開始執行的時間點到目標時間點所需的毫秒數
                //將毫秒數轉換為天數，小時數，分鐘數，秒數
                //計算；
                    //計算到結束時間所需的總的秒數
                var s=parseInt(ms/1000);    //計算秒數
                var d=parseInt(s/(24*60*60));    //計算剩余的天數：總的秒數 除以 一天所需的秒數，取整！
                var h=parseInt(s%(24*60*60)/(60*60));    //計算剩余的小時數=總的秒數內不足一天的秒數 除以 一個小時所需的秒數
                var m=parseInt(s%(60*60)/60);    //計算剩余的分鐘數=總秒數 % 一個小時的秒數 除以 一分鐘所需的秒數
                s=s%60;    //計算秒數 總的秒數按每分鐘的秒數取余
                //將計算得出的值放到頁面對應的元素中
                var str=d+"天"+h+"時"+m+"分鐘"+s+"秒";
                time.innerHTML=str;
            }
            //設定定時器，反復呼叫上述函式
            setInterval(getTime,1000);
        </script>
    </body>
</html>

使用：每個定時器啟動之后都有一個編號，可以用一個變數保存！

停止定時器：clearInterval（order）；//停止編號對應的定時器，保存的值還在，

注意：如果一個定時器，不需要使用了，需要先停止，然后釋放序號，

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/179480.html

標籤：JavaScript

上一篇：ABAP 7.55 新特性（二） ABAP SQL部分

下一篇：Chrome 瀏覽器垃圾回識訓制與記憶體泄漏分析