这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要为大家详细介绍了 js 倒计时效果的实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了 js 倒计时的具体代码,主要使用了 JS 的 Date 对象和定时器 setInterval,供大家参考,具体内容如下
- <!DOCTYPE html>
- <html>
- <head>
- <title>
- 倒计时
- </title>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <meta name="Generator" content="EditPlus">
- <meta name="Author" content="">
- <meta name="Keywords" content="">
- <meta name="Description" content="">
- </head>
- <script>
- var timstr = '2020-09-03';
- var _timer;
- //页面加载完成之后执行
- window.onload = function() {
- timerfunc(); //调用定时器
- document.getElementById('timSpan').innerHTML = timstr; //将目标时间输出
- }
- //定时器方法
- timerfunc = function() {
- _timer = setInterval('tfunc()', 1000); //生成定时器
- }
- //时间处理方法
- tfunc = function() {
- var ntim = new Date(); //当前时间戳
- var _tm = timstr.replace(/-/g, '\/'); //目标时间字段串里的-替换成/,格式化的需要
- var ftim = new Date(_tm); //格式化目标时间
- var rs = timGap(ntim.getTime(), ftim.getTime()); //调用取时间差方法
- var _str = rs.d + '天' + rs.h + '小时' + rs.m + '分钟' + rs.s + '秒'; //将返回的数据拼接字符串
- document.getElementById('gap').innerHTML = _str; //输出
- }
- //取时间差方法
- timGap = function(ntim, ftim) {
- var date3 = ftim - ntim; //时间差值毫秒数
- var days = Math.floor(date3 / (24 * 3600 * 1000)); //取天数
- var level1 = date3 % (24 * 3600 * 1000); //取天数后剩下的毫秒数
- var hours = Math.floor(level1 / (3600 * 1000)); //取小时数
- var level2 = level1 % (3600 * 1000); //取小时后剩下的毫秒数
- var minutes = Math.floor(level2 / (60 * 1000)); //取分钟
- var level3 = level2 % (60 * 1000); //取分钟后剩下的毫秒数
- var seconds = Math.floor(level3 / 1000); //取秒
- //定义对象
- var tim = {};
- //赋值
- tim['d'] = days;
- tim['h'] = hours;
- tim['m'] = minutes;
- tim['s'] = seconds;
- //console.log(tim);
- return tim; //返回数据
- }
- </script>
- <body>
- <div>
- 距离
- <span id="timSpan">
- </span>
- 还有
- <span id="gap">
- </span>
- </div>
- </body>
- </html>
来源: http://www.phperz.com/article/17/0620/327727.html