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 相关文章推荐
火狐浏览器(firefox)下获得Event对象以及keyCode
Nov 13 Javascript
javascript (用setTimeout而非setInterval)
Dec 28 Javascript
可简单避免的三个JS发布错误的详细介绍
Aug 02 Javascript
jQuery实现下拉菜单(内容为时间)的实时更新及图表的随动更新的方法
Jul 07 Javascript
JavaScript中的 attribute 和 jQuery中的 attr 方法浅析
Jan 04 Javascript
jquery——九宫格大转盘抽奖实例
Jan 16 Javascript
vue增删改查的简单操作
Jul 15 Javascript
webpack实现热加载自动刷新的方法
Jul 30 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
May 22 Javascript
基于vue实现web端超大数据量表格的卡顿解决
Apr 02 Javascript
深入浅析vue中cross-env的使用
Sep 12 Javascript
vue addRoutes路由动态加载操作
Aug 04 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笔记之:php数组相关函数的使用
2013/04/26 PHP
php的闭包(Closure)匿名函数初探
2016/02/14 PHP
基于CI框架的微信网页授权库示例
2016/11/25 PHP
PHP正则+Snoopy抓取框架实现的抓取淘宝店信誉功能实例
2017/05/17 PHP
php+croppic.js实现剪切上传图片功能
2018/08/14 PHP
网页常用特效代码整理
2006/06/23 Javascript
用javascript实现无刷新更新数据的详细步骤 asp
2006/12/26 Javascript
jquery的Theme和Theme Switcher使用小结
2010/09/08 Javascript
js新闻滚动 js如何实现新闻滚动效果
2013/01/07 Javascript
浅析jQuery EasyUI中的tree使用指南
2014/12/18 Javascript
jquery实现公告翻滚效果
2015/02/27 Javascript
一步步教大家编写酷炫的导航栏js+css实现
2016/03/14 Javascript
Angular.js与Bootstrap相结合实现手风琴菜单代码
2016/04/13 Javascript
JavaScript封装单向链表的示例代码
2020/09/17 Javascript
深入浅析Python中join 和 split详解(推荐)
2016/06/30 Python
pyenv命令管理多个Python版本
2017/03/26 Python
Python字符串、整数、和浮点型数相互转换实例
2018/08/04 Python
python numpy数组的索引和切片的操作方法
2018/10/20 Python
python pygame实现方向键控制小球
2019/05/17 Python
python字符串Intern机制详解
2019/07/01 Python
python 实现在一张图中绘制一个小的子图方法
2019/07/07 Python
Python3自动生成MySQL数据字典的markdown文本的实现
2020/05/07 Python
TensorFlow实现模型断点训练,checkpoint模型载入方式
2020/05/26 Python
Python使用plt.boxplot() 参数绘制箱线图
2020/06/04 Python
python画图时设置分辨率和画布大小的实现(plt.figure())
2021/01/08 Python
一款基于css3的动画按钮代码教程
2014/11/23 HTML / CSS
用纯CSS3实现网页中常见的小箭头
2017/10/16 HTML / CSS
荣耀商城:HIHONOR
2020/11/03 全球购物
介绍一下EJB的体系结构
2012/08/01 面试题
应届毕业生自我评价分享
2013/12/15 职场文书
《风筝》教学反思
2014/04/10 职场文书
感恩老师的演讲稿
2014/05/06 职场文书
员工工作表现自我评价
2015/03/06 职场文书
看上去很美观后感
2015/06/10 职场文书
幼儿园大班教学反思
2016/03/02 职场文书
二维码条形码生成的JavaScript脚本库
2022/07/07 Javascript