JS实现简单的时分秒倒计时代码

最新推荐文章于 2022-09-09 09:35:51 发布
最新推荐文章于 2022-09-09 09:35:51 发布
阅读量3k 收藏 1
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yelin042/article/details/78273527
版权
  1. <!DOCTYPE html>  
  2. <html lang="en">  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>js简单时分秒倒计时</title>  
  6.     <script type="text/javascript">  
  7.         function countTime() {  
  8.             //获取当前时间  
  9.             var date = new Date();  
  10.             var now = date.getTime();  
  11.             //设置截止时间  
  12.             var endDate = new Date("2016-10-22 23:23:23");  
  13.             var end = endDate.getTime();  
  14.             //时间差  
  15.             var leftTime = end-now;  
  16.             //定义变量 d,h,m,s保存倒计时的时间  
  17.             var d,h,m,s;  
  18.             if (leftTime>=0) {  
  19.                 d = Math.floor(leftTime/1000/60/60/24);  
  20.                 h = Math.floor(leftTime/1000/60/60%24);  
  21.                 m = Math.floor(leftTime/1000/60%60);  
  22.                 s = Math.floor(leftTime/1000%60);                     
  23.             }  
  24.             //将倒计时赋值到div中  
  25.             document.getElementById("_d").innerHTML = d+"天";  
  26.             document.getElementById("_h").innerHTML = h+"时";  
  27.             document.getElementById("_m").innerHTML = m+"分";  
  28.             document.getElementById("_s").innerHTML = s+"秒";  
  29.             //递归每秒调用countTime方法，显示动态时间效果  
  30.             setTimeout(countTime,1000);  
  31.   
  32.         }  
  33.     </script>  
  34. </head >  
  35. <body onload = "countTime()">  
  36.     <div>  
  37.         <span id="_d">00</span>  
  38.         <span id="_h">00</span>  
  39.         <span id="_m">00</span>  
  40.         <span id="_s">00</span>  
  41.     </div>  
  42. </body>  
  43. </html>  
东边的小山
关注
专栏目录
用js做一个倒计时(时分秒),js中倒计时器怎么实现
wenangou的博客
11-14 5872
1.核心算法：输入的时间减去现在的时间就是剩余的时间，即倒计时 ，但是不能拿着时分秒相减，比如 02 分减去22分，结果会是负数的，所以要转换为毫秒；2.用时间戳来做，用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数；3.把剩余时间总的毫秒数转换为天、时、分、秒 （时间戳转换为时分秒）。利用JavaScript函数做一个简单的倒计时。
js时分秒倒计时
leileibrother的博客
12-04 738
项目在微信商城里做了个秒杀活动，写了一段倒计时代码，虽然不是啥高端技术，还是分享一下。代码如下： html,body,div,p{margin:0;padding:0;} .content{width: 500px;height: 200px;margin:0 auto; line-height: 200
js实现倒计时时分秒
03-29
js实现倒计时的例子
简单实用的js倒计时 时分秒倒计时
07-05
js时分秒倒计时，某教育网站线上使用的同款js倒计时。
原生JS时分秒倒计时
03-12
原生JS时分秒倒计时，简洁易懂的公式，包括剩余天数，小时，分钟，秒，毫秒
详解JS实现简单的时分秒倒计时代码
12-09
本文实例为大家分享了JS时分秒倒计时的实现的具体代码，供大家参考，具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js简单时分秒倒计时<...
js实现时分秒倒计时
10-15
在现代网页设计和前端开发中，倒计时功能是一个非常...通过上述知识点的介绍和代码示例的分析，开发者可以更好地理解和掌握如何使用JavaScript来实现一个时分秒倒计时功能，并能够根据实际需求进行相应的调整和优化。
jQuery设置时分秒倒计时代码
06-24
本文将详细讲解如何利用jQuery实现时分秒倒计时功能，包括自定义设置1分钟倒计时的手机短信验证码以及固定日期时间的倒计时。 首先，我们需要了解基本的JavaScript时间处理概念。JavaScript中的Date对象用于处理...
原生JS写法精简倒计时(时分秒)
10-29
* 原生JS写法，精简倒计时 * 用法： * var test = new JJCountdown(计时总时间, 显示计时dom_id, 回调函数).show(); // output hh:mm:ss 00:00:00 * var test = new JJCountdown(计时总时间, 显示计时dom_id, 回调函数).show('m'); // output mm:ss 00:00 * var test = new JJCountdown(计时总时间, 显示计时dom_id, 回调函数).show('s'); // output ss 00
非常简单的倒计时，代码非常少，样式背景可以自己改
10-27
非常简单的倒计时，代码非常少，样式背景可以自己改 非常简单的倒计时，代码非常少，样式背景可以自己改
倒计时js代码精确到时分秒
北方的猿
09-09 730
倒计时js代码精确到时分秒
JS实现时分秒倒计时
m0_46101895的博客
02-27 1103
前一段有同事提到了这个，特研究出来，有注释分享给大家 //html部分 <body onload="countTime()" > <div class="all"> <p>距离2021/2/28 00:00:00还有</p> <div> <span id="_d">00</span> <span id="_h">00</span> <span id="_m"
简易的倒计时代码
热门推荐
从零出发
05-27 1万+
在一些活动项目中，大多会涉及倒计时。以下为倒计时代码，供小白参考。关键词：计时器、时间差具体代码如下：&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;倒计时代码&lt;/title&gt; &lt;style type="te
简易js时分秒倒计时
github_38928905的博客
07-20 632
function resetTime(totalTime){ var timer=setInterval(function(){ var s = (totalTime%60) &lt; 10 ? ('0' + totalTime%60) : totalTime%60; var h...
js简单时分秒倒计时
希文Gershwin
06-16 2541
最近做浏览器界面倒计时，用js就实现，两种方式： 一：设置时长，进行倒计时。比如考试时间等等 代码如下： <html> <head> <meta charset="UTF-8"> <title>简单时长倒计时</title> <SCRIPT type="text/javascript"> var maxtime = 60 * 60; //一个小时，按秒计算，自己调整! function C
简单易用的倒计时js代码
longjef的博客
11-15 542
倒计时js代码想必大家都有用过，大同小异，本例为大家介绍的是简单易用的,需要的朋友可以参考下。 简单易用的倒计时js代码 *{ margin:0; padding:0; list-style:none;} body{ font-size:18px; text-align:center;} .time{ height:30px; padding:200px;}
html 天 时分秒倒计时
最新发布
05-14
可以通过 JavaScript 实现一个简单的天时分秒倒计时，以下是一个示例代码： ```html <!DOCTYPE html> 倒计时 <h1 id="countdown"></h1> // 设置倒计时的结束时间（年月日时分秒） var ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值