JavaScript 日期对象 Date
2015-12-28 14:07
786 查看
通过三个例子,可以涵盖 Date 的基本用法:
1. 动态的显示当前的日期和时间格式
效果为:2015年12月28日 星期一 14:09:53
参见下面 showTime 函数:
function showTime(){
var nowDate=new Date(); //当前日期
var year=nowDate.getFullYear(); //年
var month=nowDate.getMonth()+1; //月
var date=nowDate.getDate(); //日
var d=nowDate.getDay(); //星期
var weekday=new Array(7); //存储星期字符串的数组
weekday[0]="星期日";
weekday[1]="星期一";
weekday[2]="星期二";
weekday[3]="星期三";
weekday[4]="星期四";
weekday[5]="星期五";
weekday[6]="星期六";
var h=nowDate.getHours(); //小时
h=checkTime(h); //规范化
var m=nowDate.getMinutes(); //分钟
m=checkTime(m);
var s=nowDate.getSeconds(); //秒
s=checkTime(s);
document.getElementById('time1').innerHTML=year+'年'+month+'月'+date+'日 '+weekday[d]+' '+h+':'+m+':'+s; //显示格式
setTimeout(showTime,1000); //1s后再次调用本函数
}其中的 checkTime 函数用于规范化,如把“6”变为“06”,函数如下:
function checkTime(i){
if(i<10){
i='0'+i;
}
return i;
}
2. 倒计时--还剩?天
效果为:距离2022年北京冬奥会还有2230天
方法:用冬奥会的日期减去当前日期,再换算成天数即可,注意在相减之前用getTime()取毫秒数。
var curTime=new Date(); //当前日期
var OWG_Time=new Date("2022,2,4"); //冬奥会日期
var detaOWG_time=Math.ceil((OWG_Time.getTime()-curTime.getTime())/(24*60*60*1000)); //二者差值
document.getElementById('time2').innerHTML='距离2022年北京冬奥会还有 '+detaOWG_time+' 天'; //显示
3. 倒计时--还剩?天?小时?分钟?秒
效果为:距离2016春节还有:41天9小时36分钟59秒
调用以下的 countDown 函数即可:
function countDown(){
var curTime=new Date(); //当前日期
var Spring_Time=new Date("2016/2/8,00:00:00"); //春节日期
var detaSpring_time=parseInt((Spring_Time.getTime()-curTime.getTime())/1000+1); //差值,parseInt取整数部分
if(detaSpring_time<=0){ //如果差值小于0,则不再倒计时,直接显示新年快乐
document.getElementById('time3').innerHTML='Happy New Year !!';
}
else{
var Spring_d=parseInt(detaSpring_time/(24*60*60)); //剩多少天
var Spring_h=parseInt(detaSpring_time/(60*60)%24); //剩多少小时
var Spring_m=parseInt(detaSpring_time/60%60); //剩多少分钟
var Spring_s=parseInt(detaSpring_time%60); //剩多少秒
document.getElementById('time3').innerHTML='距离2016春节还有:'+Spring_d+'天'+Spring_h+'小时'+Spring_m+'分钟'+Spring_s+'秒'; //显示
setTimeout(countDown,1000); //1s后再次调用本函数
}
}
1. 动态的显示当前的日期和时间格式
效果为:2015年12月28日 星期一 14:09:53
参见下面 showTime 函数:
function showTime(){
var nowDate=new Date(); //当前日期
var year=nowDate.getFullYear(); //年
var month=nowDate.getMonth()+1; //月
var date=nowDate.getDate(); //日
var d=nowDate.getDay(); //星期
var weekday=new Array(7); //存储星期字符串的数组
weekday[0]="星期日";
weekday[1]="星期一";
weekday[2]="星期二";
weekday[3]="星期三";
weekday[4]="星期四";
weekday[5]="星期五";
weekday[6]="星期六";
var h=nowDate.getHours(); //小时
h=checkTime(h); //规范化
var m=nowDate.getMinutes(); //分钟
m=checkTime(m);
var s=nowDate.getSeconds(); //秒
s=checkTime(s);
document.getElementById('time1').innerHTML=year+'年'+month+'月'+date+'日 '+weekday[d]+' '+h+':'+m+':'+s; //显示格式
setTimeout(showTime,1000); //1s后再次调用本函数
}其中的 checkTime 函数用于规范化,如把“6”变为“06”,函数如下:
function checkTime(i){
if(i<10){
i='0'+i;
}
return i;
}
2. 倒计时--还剩?天
效果为:距离2022年北京冬奥会还有2230天
方法:用冬奥会的日期减去当前日期,再换算成天数即可,注意在相减之前用getTime()取毫秒数。
var curTime=new Date(); //当前日期
var OWG_Time=new Date("2022,2,4"); //冬奥会日期
var detaOWG_time=Math.ceil((OWG_Time.getTime()-curTime.getTime())/(24*60*60*1000)); //二者差值
document.getElementById('time2').innerHTML='距离2022年北京冬奥会还有 '+detaOWG_time+' 天'; //显示
3. 倒计时--还剩?天?小时?分钟?秒
效果为:距离2016春节还有:41天9小时36分钟59秒
调用以下的 countDown 函数即可:
function countDown(){
var curTime=new Date(); //当前日期
var Spring_Time=new Date("2016/2/8,00:00:00"); //春节日期
var detaSpring_time=parseInt((Spring_Time.getTime()-curTime.getTime())/1000+1); //差值,parseInt取整数部分
if(detaSpring_time<=0){ //如果差值小于0,则不再倒计时,直接显示新年快乐
document.getElementById('time3').innerHTML='Happy New Year !!';
}
else{
var Spring_d=parseInt(detaSpring_time/(24*60*60)); //剩多少天
var Spring_h=parseInt(detaSpring_time/(60*60)%24); //剩多少小时
var Spring_m=parseInt(detaSpring_time/60%60); //剩多少分钟
var Spring_s=parseInt(detaSpring_time%60); //剩多少秒
document.getElementById('time3').innerHTML='距离2016春节还有:'+Spring_d+'天'+Spring_h+'小时'+Spring_m+'分钟'+Spring_s+'秒'; //显示
setTimeout(countDown,1000); //1s后再次调用本函数
}
}
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- Python动态类型的学习---引用的理解
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法
- Redux系列02:一个炒鸡简单的react+redux例子
- JavaScript 各种遍历方式详解
- call/apply/bind 的理解与实例分享
- 如何创建对象以及jQuery中创建对象的方式