<!DOCTYPE html>
<html lang = "en" >
<head >
<meta charset = "UTF-8" >
<meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
<meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
<title >Document</title >
<script src = "https://code.jquery.com/jquery-3.6.0.min.js" ></script >
</head >
<body >
<p></p>
<p></p>
<p></p>
<script !src = "" >
let p=document.querySelectorAll("p")
let xs=p[0];
let fz=p[1]
let m=p[2]
//初始值
//s控制几个小时,数字几就是几小时
let s=3;
let f=0;
let i=0;
//第一种方法
// var timer=setInterval(function (){
// if(i>0){
// i--
// }else if(i==0&&f>0){
// f--;i=59;
// }else if(i==0&&f==0&&s>0){
// s--;
// f=59;
// i=59;
// }else {
// clearInterval(timer)
// }
//
// xs.innerHTML=s>9?s:"0"+s
// fz.innerHTML=f>9?f:"0"+f
// m.innerHTML=i>9?i:"0"+i
// },1000)
//第二种方法
var ms=s*60*60+f*60+i
var temer =setInterval(function (){
if(ms>0){
ms--
}else {
clearInterval(temer)
}
var s=parseInt(ms/(60*60));
var f=parseInt((ms-s*60*60)/60);
var i=ms-s*60*60-f*60
xs.innerHTML=s>9?s:"0"+s
fz.innerHTML=f>9?f:"0"+f
m.innerHTML=i>9?i:"0"+i
},100)
</script >
</body >
</html >
简单的倒计时(不用时间戳),两种方法
最新推荐文章于 2023-06-06 15:59:43 发布