js頁面動態時間展示

效果圖：

 

 

具體代碼

　　js代碼

<script type="text/javascript">
    var t = null;
    t = setTimeout(time,1000);//開始運行
    function time()
    {
        clearTimeout(t);//清除定時器
        dt = new Date();
        var y=dt.getFullYear();//獲取年
        var m=dt.getMonth();//獲取月
        var d=dt.getDate();//獲取日
        var h=dt.getHours();//獲取時
        var f=dt.getMinutes();//獲取分
        var s=dt.getSeconds();//獲取秒
        document.getElementById("showTime").innerHTML =  "本次作業完成距離現在：<span style='color: darkred;'>"+y+"年"+(m+1)+"月"+d+"日"+h+"時"+f+"分"+s+"秒 </span>";
        t = setTimeout(time,1000); //設定定時器，循環運行
    }

</script>

　　

　　html代碼

<span id="showTime"></span>

　　

實現的依據

　　主要是依靠這個定時器讓js一直在運行，實現動態的效果！就像輪播圖一樣。采用的是js輪循！

 

說明

轉載請注明出處！謝謝配合