当前位置：首页 » 网站优化 » 正文

js实现指定时间倒计时方法

 人参与  2022年10月17日 12:30  分类 : 网站优化  点这评论

简介js根据输入的日期时间，实现距离当前时间的倒计时，程序比较简单，直接上代码

21017123028872.jpg

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    </head>
<body>
  <div class="count_box"></div>
  <script>
  window.onload = function () {
  countDown();
  function fillZero(i) {
  return i < 10 ? "0" + i: i + "";
  }
  function countDown() {
  var nowtime = new Date();
  var endtime = new Date("2021/12/09,23:59:59");//日期格式建议用斜杠
  var result = parseInt((endtime.getTime() - nowtime.getTime()) / 1000);
  var d = parseInt(result / (24*60*60))
  var h = parseInt(result / (60 * 60) % 24);
  var m = parseInt(result / 60 % 60);
  var s = parseInt(result % 60);
  d = fillZero(d)
  h = fillZero(h);
  m = fillZero(m);
  s = fillZero(s);
  if(parseInt(d)>0){
document.querySelector(".count_box").innerHTML = `距离当前时间：  ${d}天 ${h} 时 ${m} 分 ${s} 秒`;
  }else{
if(parseInt(h)>0){
document.querySelector(".count_box").innerHTML = `距离当前时间：  ${h} 小时 ${m} 分 ${s} 秒`;
}else{
if(parseInt(m)>0){
document.querySelector(".count_box").innerHTML = `距离当前时间：  ${m} 分 ${s} 秒`;
}else{
document.querySelector(".count_box").innerHTML = `距离当前时间：  ${s} 秒`;
}
}
 
  }
   
  if (result <= 0) {
  document.querySelector(".count_box").innerHTML = "倒计时结束";
  return;
  }
  setTimeout(countDown, 1000);
}
}
</script>
</body>
</html>


本文由本站原创或投稿者首发,转载请注明来源！

本文链接：http://www.ziti66.com/net/html/57.html

本文标签：js    

微信公众号：升级接入中

<< 上一篇下一篇 >>
为祖国加油
祖国加油,相信新的一年会更好...
为祖国加油
森林防火，人人有责。祖国加油...

  • 评论（0）
  • 赞助本站

◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。

相关文章


最新发布:

搜索

网站分类

Tags列表

最新留言

++发现更多精彩++

    海内存知己，天涯若比邻。

黔ICP备2020011602号黔ICP备2020011602号-8
贵公安备52052602000222号

❤安全运行天 Copyright © 2018-2025 66字体网 版权所有.

本站采用创作共用版权 CC BY-NC-SA 3.0 CN 许可协议，转载或复制请注明出处