后台获取的时间进行时分秒倒计时

最新推荐文章于 2021-06-24 15:16:53 发布

这个杀手好冷

最新推荐文章于 2021-06-24 15:16:53 发布

阅读量1.8k

点赞数 1

分类专栏：前端 javascript 文章标签：后台获取的时间进行时分秒倒计时

本文链接：https://blog.csdn.net/qq_43649479/article/details/84984604

版权

前端同时被 2 个专栏收录

26 篇文章 1 订阅

订阅专栏

javascript

22 篇文章 0 订阅

订阅专栏

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js简单时分秒倒计时</title>
    <!--<script src="js/dayClickIn/dayClockIn.js"></script>-->
    <script type="text/javascript">
    	
    	var newTime = Date.parse(new Date());
    		timeResidue = '23:0:1' ;
    		timeResidue = timeResidue.split(":");
    	var timeResidue1 = (timeResidue[0]*3600 + timeResidue[1]*60 + timeResidue[2]*1)*1000;
    	var timeDing = 	newTime + timeResidue1; //截止时间
      

		var timer =    setInterval(function(){
		    	var now = Date.parse(new Date());
			    timeResidue1 = timeResidue1 - 1000;
			    //定义变量 h,m,s保存倒计时的时间
			    var h,m,s;
			    if (timeResidue1>=0) {
			        h = Math.floor(timeResidue1/1000/60/60%24);
			        m = Math.floor(timeResidue1/1000/60%60);
			        s = Math.floor(timeResidue1/1000%60);  
			        //将倒计时赋值到div中
//				    $('.count_down').html(h+":"+m+":"+s)
					document.getElementsByClassName("count_down")[0].innerText= h +":"+m+":"+s;
//					console.log(document.getElementsByClassName("count_down"))
				    //递归每秒调用countTime方法，显示动态时间效果
			    }else{
			    	clearInterval(timer)
			    }
				    
			    
		    },1000)
		
    </script>
</head >
<body >
    <div>
        <span class="count_down">00</span>
    </div>
</body>
</html>