简单的倒计时(不用时间戳),两种方法

<!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 >

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

萧寂173

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值