js-------》(小效果)实现倒计时及时间对象
JS实现倒计时效果代码如下:

1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>无标题文档</title>h
6 <style>
7 #box {
8 width: 100%;
9 height: 400px;
10 background: black;
11 color: #fff;
12 font-size:40px;
13 line-height:400px;
14 text-align:center;
15 }
16 </style>
17 <script>
18 window.onload = function(){
19 var oBox = document.getElementById('box');
20 var oDate = new Date();//获取当前时间;
21 oDate.setFullYear(2016,11,31);//自动进位;
22 oDate.setHours(0,0,0,0);
23
24 function countDown(){
25 //未来时间戳减去现在时间的时间戳;
26 var ms = oDate.getTime() - new Date().getTime();
27
28 //毫秒转换成秒
29 var oSec = parseInt(ms/1000);
30
31 //秒转换成天
32 var oDay = parseInt(oSec/86400);
33
34 //不到一天剩下的秒数;
35 oSec%=86400;
36
37 //转换成小时
38 var oHour = parseInt(oSec/3600);
39
40 //不到一小时剩下的秒数;
41 oSec%=3600;
42
43 //转换成分钟
44 var oMin = parseInt(oSec/60);
45
46 //不到一分钟剩下的秒数;
47 oSec%=60;
48
49 oBox.innerHTML = '距离2016年12月31日还有:'+oDay+'天'+oHour+'时'+oMin+'分'+oSec+'秒';
50 }
51 countDown();
52 setInterval(countDown,1000);
53 }
54 </script>
55 </head>
56
57 <body>
58 <div id="box">距离2016年12月31日还有:xx天xx时xx分xx秒</div>
59 </body>
60 </html>

实现效果入下:
时间戳:1970年1月日至今的毫秒数:oDate.getTime(); //不要问我为什么是1970年1月至今哦!自个儿百度啦!
时间对象:
获取时间: var oDate = new Date(); oYear = oDate.getFullYear(); oMon = oDate.getMonth(); oDay = oDate.getDate(); oHou = oDate.getHours(); oMin = oDate.getMinutes(); oSec = oDate.getSeconds(); oWeek = oDate.getDay(); 设置时间: oDate.setFullYear(年,月,日); oDate.setMonth(月); oDate.setDate(日); oDate.setHours(时,分,秒,毫秒); 时间会自动进位;
这是一个小效果,如果有不对的是地方,互相交流;
js-------》(小效果)实现倒计时及时间对象的更多相关文章
- js实现倒计时及时间对象
JS实现倒计时效果代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> ...
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题(F.ui.name)
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- js小效果-轮播图
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- js小效果:返回顶部 scrollTop 。 滚屏:animate
返回顶部: (scroll 滚屏事件,如果超出第一屏,显示返回顶部的按钮) <div id="gotop" onclick="javascript:scroll(0 ...
- JS小知识--获取当前日期的时间和上周五时间
获取当前日期的时间和上周五时间 var today=new Date();//获取当前时间var weekday=today.getDay();//获取星期几 var monday=new Da ...
- js小效果-全选
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- js小效果-简易计算器
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- js小效果-双色球
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
随机推荐
- jquery 当前链接激活传递参数|div的切换显示
一.链接激活时传递参数 $("a").click(function(){ var obj=$(this).attr("field"); //获取当前field ...
- [算法][包围盒]球,AABB,OBB
参考地址请看图片水印:http://www.cnblogs.com/iamzhanglei/archive/2012/06/07/2539751.html http://blog.sina.com.c ...
- lua代码优化(转)
暂时转了别人一篇,以后再优化 1.使用局部变量local 这是最基础也是最有用的策略,虽然使用全局变量并不能完全避免,但还是应该尽量避免,取而代之使用局部变量即local.这里的局部变量也包括函数fu ...
- C Looooops(扩展欧几里得)
C Looooops Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 20128 Accepted: 5405 Descripti ...
- Friendship
Friendship Time Limit: 2000MS Memory Limit: 20000K Total Submissions: 9824 Accepted: 2720 Descriptio ...
- 哈夫曼树-Fence Repair 分类: 树 POJ 2015-08-05 21:25 2人阅读 评论(0) 收藏
Fence Repair Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 32424 Accepted: 10417 Descri ...
- 算法大全(c,c++)
http://www.2cto.com/kf/201109/105758.html 算法大全(C,C++)一. 数论算法 1.求两数的最大公约数function gcd(a,b:integer):in ...
- 第十六章:网络IPC:套接字
16.1.引言 上一章考查了各种Unix系统所提供的经典进程间通信(IPC)机制:管道.先进先出.消息队列.信号量以及共享内存.通过这些机制,同一台计算机上运行的进程可以相互通信.本章将考查不同计算机 ...
- camera isp
1. 目标手机摄像头模组用ISP功能模块的市场走向及研发方向.为能够正确认识手机摄像模组行业提供技术及市场依据.2. ISP在模组上的应用原理2.1 功能区域无论数码相机.摄像机或者摄像手机,其影像数 ...
- Java中通过JDBC远程连接Oracle数据库
通过jdbc连接数据库,拢共分三步: 第一步:下载一个JDBC的驱动,然后把jar包扔到项目里并add to build path: 第二步:去本地oracle文件夹下找到“TNSNAMES.ORA” ...