本文实例为大家分享了JavaScript实现秒杀时钟倒计时的具体代码，供大家参考，具体内容如下
功能介绍：
1.时/分/秒倒计时直至为零
所有代码
<!DOCTYPE html>
<html>
<head>
<meta charset=\"utf-8\" />
<title>倒计时</title>
<style type=\"text/css\">
*{
margin:0;
padding:0;
}
span{
display: inline-block;
width: 60px;
height: 60px;
border-radius: 50%;
background: black;
color: white;
font-size: 30px;
text-align: center;
line-height: 60px;
}
i{
font-style: normal;
font-size: 20px;
}
</style>
</head>
<body>
<span id=\"hs\">1</span>
<i>:</i>
<span id=\"ms\">59</span>
<i>:</i>
<span id=\"ss\">47</span>
</body>
</html>
<script type=\"text/javascript\">
//倒计时
var count = 1;
var Counter;
function countDown(){ //调用
Counter = setInterval(f,1000);
}
countDown(); //自运行
//倒计时
function f(){
var hs = Number(document.getElementById(\"hs\").innerHTML);
var ms = Number(document.getElementById(\"ms\").innerHTML);
var ss = Number(document.getElementById(\"ss\").innerHTML);
if(hs==0&&ms==0&&ss==0||ss>60||ms>60||hs>24){
var hs = document.getElementById(\"hs\").innerHTML = \"00\";
var ms = document.getElementById(\"ms\").innerHTML = \"00\";
var ss = document.getElementById(\"ss\").innerHTML = \"00\";
clearInterval(Counter);
console.log(count);
return;
}
if(ss>0){
ss--;
document.getElementById(\"ss\").innerHTML = ss;
count++;
}
if(ss==0){
if(ms>0){
ms--;
document.getElementById(\"ms\").innerHTML = ms;
document.getElementById(\"ss\").innerHTML = 59;
}
}
if(ms==0){
if(hs>0){
hs--;
document.getElementById(\"hs\").innerHTML = hs;
document.getElementById(\"ms\").innerHTML = 59;
}
}
}
</script>
更多JavaScript时钟特效点击查看：JavaScript时钟特效专题
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
© 版权声明
THE END
暂无评论内容