JavaScript 日期对象 Date

本文详细介绍了使用JavaScript动态显示当前日期和时间的方法,并通过两个实例展示了如何实现倒计时功能,包括显示剩余天数和具体天数、小时、分钟和秒。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

通过三个例子,可以涵盖 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后再次调用本函数
	}
}





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值