前端:倒计时

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="content"></div>
    <!-- 第二个倒计时,需要几个自行叠加 -->
    <div class="content2"></div>  
</body>
</html>
<!-- 倒计时 --><!-- 倒计时 --><!-- 倒计时 --><!-- 倒计时 --><!-- 倒计时 -->
<script type="text/javascript">
    function countDown(){
        var start = new Date();  //开始时间
    var end = new Date('2032/2/14,23:10:59');//结束时间,可以设置时间  
    var result = parseInt((end.getTime()-start.getTime())/1000);//计算出毫秒
    var d = parseInt(result/(24*60*60));//用总共的秒数除以1天的秒数
    var h = parseInt(result/(60*60)%24);//精确小时,用取余
    var m = parseInt(result/60%60);//剩余分钟就是用1小时等于60分钟进行取余
    var s = parseInt(result%60);
    document.querySelector('.content').innerHTML = '距开抢'+d+''+h+':'+m+':'+s;
     // 第二个倒计时
    document.querySelector('.content2').innerHTML = '距开抢'+d+''+h+':'+m+':'+s;
    setTimeout(countDown,500);
    //当倒计时结束时,改变内容
    if(result<=0){
        document.querySelector('.content').innerHTML = '倒计时结束'
        // 第二个倒计时结束
        document.querySelector('.content2').innerHTML = '倒计时结束'
    }
    }
    countDown()
   
    </script>
复制代码

 

posted @   Hh0826  阅读(46)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现
· 25岁的心里话
点击右上角即可分享
微信分享提示