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 相关文章推荐
让你的网站可编辑的实现js代码
Oct 19 Javascript
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 Javascript
详细介绍8款超实用JavaScript框架
Oct 25 Javascript
JSONP跨域的原理解析及其实现介绍
Mar 22 Javascript
extjs_02_grid显示本地数据、显示跨域数据
Jun 23 Javascript
Bootstrap滚动监听(Scrollspy)插件详解
Apr 26 Javascript
微信小程序(应用号)简单实例应用及实例详解
Sep 26 Javascript
jquery实现折叠菜单效果【推荐】
Mar 08 Javascript
JavaScript数据结构中串的表示与应用实例
Apr 12 Javascript
React-Router如何进行页面权限管理的方法
Dec 06 Javascript
vue输入框使用模糊搜索功能的实现代码
May 26 Javascript
微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)
Jun 11 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
jQuery EasyUI API 中文文档 - DateBox日期框
2011/10/15 PHP
php addslashes 利用递归实现使用反斜线引用字符串
2013/08/05 PHP
PHP面向对象教程之自定义类
2014/06/10 PHP
ThinkPHP实现事务回滚示例代码
2014/06/23 PHP
php文件后缀不强制为.php的实操方法
2019/09/18 PHP
js arguments.callee的应用代码
2009/05/07 Javascript
jquery UI 1.72 之datepicker
2009/12/29 Javascript
javascript入门基础之私有变量
2010/02/23 Javascript
innerText和textContent对比及使用介绍
2013/02/27 Javascript
AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
2014/06/06 Javascript
用jquery模仿的a的title属性的例子
2014/10/22 Javascript
浅谈javascript中onbeforeunload与onunload事件
2015/12/10 Javascript
微信小程序 canvas API详解及实例代码
2016/10/08 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
2016/12/16 Javascript
Jquery uploadify 多余的Get请求(404错误)的解决方法
2017/01/26 Javascript
vue通过点击事件读取音频文件的方法
2018/05/30 Javascript
微信小程序webview实现长按点击识别二维码功能示例
2019/01/24 Javascript
Vue CLI4 Vue.config.js标准配置(最全注释)
2020/06/05 Javascript
详解Vite的新体验
2021/02/22 Javascript
[49:59]KG vs Mineski 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python实现文件路径和url相互转换的方法
2015/07/06 Python
Python爬虫抓取代理IP并检验可用性的实例
2018/05/07 Python
Python实现的线性回归算法示例【附csv文件下载】
2018/12/29 Python
Python实现计算对象的内存大小示例
2019/07/10 Python
Python中模块(Module)和包(Package)的区别详解
2019/08/07 Python
python cv2在验证码识别中应用实例解析
2019/12/25 Python
Python unittest框架操作实例解析
2020/04/13 Python
社区志愿者心得体会
2014/01/03 职场文书
情人节寄语大全
2014/04/11 职场文书
室内趣味活动方案
2014/08/24 职场文书
老员工辞职信范文
2015/05/12 职场文书
2015年房产经纪人工作总结
2015/05/15 职场文书
简历自我评价范文
2019/04/24 职场文书
读《钢铁是怎样炼成的》有感:百炼方成钢
2019/11/05 职场文书
Java常用工具类汇总 附示例代码
2021/06/26 Java/Android
欧元符号 €
2022/02/17 杂记