JavaScript电子时钟倒计时第二款


Posted in Javascript onJanuary 10, 2016

本文实例讲解了JavaScript电子时钟倒计时的详细代码,分享给大家供大家参考,具体内容如下
JavaScript时间类
1、获取时分秒:
getHours()
getMinutes();
getSeconds();
2、获取年月日:
getFullYear();
getMonth() + 1;//获取的月份需要+1;
getDate(); //日期
getDay(); //获取的是星期,0--》星期天

效果图:

JavaScript电子时钟倒计时第二款

具体代码:

<!doctype html> 
<html> 
<meta charset="utf-8"> 
<title>倒计时</title>
<head> 

   <style type="text/css">
   *{
     margin: 0;
     padding: 0;

   }
    .wrap{
      width: 350px;
      height: 100px;
      background-color: black;
    }
    #dates{
      color: #fff;
      margin-top: 10px;
      display: block;
      margin-left: 15px;
    }
    p{
      color: #fff;
    }
   </style>
</head> 
<body> 
<div class="wrap">
  <p>距离2016年02月08号00时00分00秒春节倒计时:</p>
  <!-- <p>距离2016年01月07号23时59分59秒倒计时:</p> -->
  <span id="dates"></span>
</div>
<script type="text/javascript"> 
var dates = document.getElementById("dates");
function getRTime(){ 
var EndTime= new Date('2016/02/07 23:59:59'); //截止时间 
var NowTime = new Date(); 
var t =EndTime.getTime() - NowTime.getTime(); 

var d=Math.floor(t/1000/60/60/24); 
var h=Math.floor(t/1000/60/60%24); 
var m=Math.floor(t/1000/60%60); 
var s=Math.floor(t/1000%60); 
var p=Math.floor(t%60);
if(d<10){
  d="0"+d;
}
if(h<10){
  h="0"+h;
}
if(m<10){
  m="0"+m;
}
if(s<10){
  s="0"+s;
}
if(p<10){
  p="0"+p;
}

dates.innerHTML=d+ "日" + h + "小时"+ m +"分" + s +"秒"+p+"毫秒";
} 
setInterval(getRTime,1); 
</script> 
</body> 
</html>

以上就是本文的详细内容,希望对大家的学习javascript程序设计有所帮助。

Javascript 相关文章推荐
使两个iframe的高度与内容自适应,且相等
Nov 20 Javascript
插件:检测javascript的内存泄漏
Mar 04 Javascript
prototype Element学习笔记(篇二)
Oct 26 Javascript
javascript 多种搜索引擎集成的页面实现代码
Jan 02 Javascript
IE6/7/8中Option元素未设value时Select将获取空字符串
Apr 07 Javascript
多个checkbox被选中时如何判断是否有自己想要的
Sep 22 Javascript
jQuery实现监控页面所有ajax请求的方法
Dec 10 Javascript
强大的 Angular 表单验证功能详细介绍
May 23 Javascript
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
May 26 Javascript
详解webpack + vue + node 打造单页面(入门篇)
Sep 23 Javascript
详解CommonJS和ES6模块循环加载处理的区别
Dec 26 Javascript
vue项目中仿element-ui弹框效果的实例代码
Apr 22 Javascript
基于javascript实现彩票随机数生成(简单版)
Apr 17 #Javascript
Node.js静态文件服务器改进版
Jan 10 #Javascript
实例讲解javascript注册事件处理函数
Jan 09 #Javascript
详解javascript事件冒泡
Jan 09 #Javascript
js父页面中使用子页面的方法
Jan 09 #Javascript
jquery调整表格行tr上下顺序实例讲解
Jan 09 #Javascript
实例讲解js验证表单项是否为空的方法
Jan 09 #Javascript
You might like
基于PHP导出Excel的小经验 完美解决乱码问题
2013/06/10 PHP
分享php邮件管理器源码
2016/01/06 PHP
CI框架无限级分类+递归的实现代码
2016/11/01 PHP
javascript 图片上传预览-兼容标准
2009/06/01 Javascript
Prototype Array对象 学习
2009/07/19 Javascript
解决JS中乘法的浮点错误的方法
2014/01/03 Javascript
jQuery插件windowScroll实现单屏滚动特效
2015/07/14 Javascript
jQuery无刷新切换主题皮肤实例讲解
2015/10/21 Javascript
Javascript中神奇的this
2016/01/20 Javascript
基于JavaScript实现图片点击弹出窗口而不是保存
2016/02/06 Javascript
AngularJS ng-change 指令的详解及简单实例
2016/07/30 Javascript
基于JS实现发送短信验证码后的倒计时功能(无视页面刷新,页面关闭不进行倒计时功能)
2016/09/02 Javascript
基于bootstrap的选择框插件icheck
2016/12/23 Javascript
Omi v1.0.2发布正式支持传递javascript表达式
2017/03/21 Javascript
[38:39]完美世界DOTA2联赛循环赛 IO vs GXR BO2第二场 11.04
2020/11/05 DOTA
[03:07]完美世界DOTA2联赛PWL DAY10 决赛集锦
2020/11/11 DOTA
python检测lvs real server状态
2014/01/22 Python
Python实现截屏的函数
2015/07/25 Python
python实现简单飞行棋
2020/02/06 Python
Python实现鼠标自动在屏幕上随机移动功能
2020/03/14 Python
Python自带的IDE在哪里
2020/07/01 Python
使用PyCharm官方中文语言包汉化PyCharm
2020/11/18 Python
详解CSS3中nth-child与nth-of-type的区别
2017/01/05 HTML / CSS
HTML5 canvas标签实现刮刮卡效果
2015/04/24 HTML / CSS
浅析HTML5:'data-'属性的作用
2018/01/23 HTML / CSS
用canvas做一个DVD待机动画的实现代码
2019/04/12 HTML / CSS
澳大利亚手表品牌:Time IV Change
2018/10/06 全球购物
经济实惠的名牌太阳镜和眼镜:Privé Revaux
2021/02/07 全球购物
优秀的计算机专业求职信范文
2013/12/27 职场文书
春节超市活动方案
2014/08/14 职场文书
企业党建工作总结2015
2015/05/26 职场文书
茶花女读书笔记
2015/06/29 职场文书
高中英语教学反思范文
2016/03/02 职场文书
2019自荐信该如何写呢?
2019/07/05 职场文书
详解Spring事件发布与监听机制
2021/06/30 Java/Android
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python