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 相关文章推荐
jquery.jstree 增加节点的双击事件代码
Jul 27 Javascript
基于mouseout和mouseover等类似事件的冒泡问题解决方法
Nov 18 Javascript
jqGrid 学习笔记整理——进阶篇(一 )
Apr 17 Javascript
js完整倒计时代码分享
Sep 18 Javascript
javascript对浅拷贝和深拷贝的详解
Oct 14 Javascript
利用js获取下拉框中所选的值
Dec 01 Javascript
利用Vue.js框架实现火车票查询系统(附源码)
Feb 27 Javascript
angular仿支付宝密码框输入效果
Mar 25 Javascript
详解AngularJs HTTP响应拦截器实现登陆、权限校验
Apr 11 Javascript
vue Render中slots的使用的实例代码
Jul 19 Javascript
Angular实现svg和png图片下载实现
May 05 Javascript
浅谈Vue项目骨架屏注入实践
Aug 05 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
JS操作XML中DTD介绍及使用方法分析
2019/07/04 PHP
Docker 安装 PHP并与Nginx的部署实例讲解
2021/02/27 PHP
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
javascript处理表单示例(javascript提交表单)
2014/04/28 Javascript
jQuery Ajax()方法使用指南
2014/11/19 Javascript
jQuery插件实现带圆点的焦点图片轮播切换
2016/01/18 Javascript
基于JavaScript实现动态添加删除表格的行
2016/02/01 Javascript
BootStrap selectpicker
2016/06/20 Javascript
详解angular中如何监控dom渲染完毕
2017/01/03 Javascript
JavaScript中关于class的调用方法
2017/11/28 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
vue-baidu-map 进入页面自动定位的解决方案(推荐)
2018/04/28 Javascript
iconfont的三种使用方式详解
2018/08/05 Javascript
webpack项目使用eslint建立代码规范实现
2019/05/16 Javascript
js防抖函数和节流函数使用场景和实现区别示例分析
2020/04/11 Javascript
学前端,css与javascript重难点浅析
2020/06/11 Javascript
antd design table更改某行数据的样式操作
2020/10/31 Javascript
[57:38]2018DOTA2亚洲邀请赛3月30日 小组赛A组 OpTic VS OG
2018/03/31 DOTA
Python Mysql自动备份脚本
2008/07/14 Python
Python程序设计入门(2)变量类型简介
2014/06/16 Python
python引用DLL文件的方法
2015/05/11 Python
Python实现希尔排序算法的原理与用法实例分析
2017/11/23 Python
Python编写Windows Service服务程序
2018/01/04 Python
最新PyCharm从安装到PyCharm永久激活再到PyCharm官方中文汉化详细教程
2020/11/17 Python
python中scrapy处理项目数据的实例分析
2020/11/22 Python
String是最基本的数据类型吗?
2013/06/13 面试题
继承时候类的执行顺序问题,一般都是选择题,问你将会打印出什么?
2015/11/18 面试题
《放飞蜻蜓》教学反思
2014/04/27 职场文书
市场推广策划方案
2014/06/02 职场文书
会议通知格式范文
2015/04/15 职场文书
学生会自荐信
2019/05/16 职场文书
C站最全Python标准库总结,你想要的都在这里
2021/07/03 Python
解决使用了nginx获取IP地址都是127.0.0.1 的问题
2021/09/25 Servers
MySQL数据库索引的最左匹配原则
2021/11/20 MySQL
基于docker安装zabbix的详细教程
2022/06/05 Servers
JavaScript架构localStorage特殊场景下二次封装操作
2022/06/21 Javascript