JavaScript实现页面动态时钟模型

写在前面:实现动态时钟效果可以使用setTimeout()或setInterval()函数。

setTimeout(showTime,1000);//在指定的时间(1秒)后,执行showTime

setInterval(showTime,1000);//在指定的时间(1秒)后,调用showTime函数

主要代码:

//显示时间   定义一个函数(功能)
function showTime(){
	var date=new Date();
	//  2018/6/29 16:23:00
	//获取年月日
	var year=date.getFullYear();
	var month=date.getMonth()+1;
	var day=date.getDate();

	//获取时分秒
	var hour=date.getHours();
	var minute=date.getMinutes();
	var second=date.getSeconds();

	//时间小于10时,补零
	if(hour<10){
		hour='0'+hour;
	}

	if(minute<10){
		minute='0'+minute;
	}

	if(second<10){
		second='0'+second;
	}

	var time=year+'/'+month+'/'+day+" "+hour+":"+minute+':'+second;

	var o=document.getElementById('box');//在页面中根据ID查找标签对象
	// console.log(o);
	o.innerHTML=time;//innerHTML 指HTML开始标记和结束标记之间的内容

	setTimeout(showTime,1000);//一秒钟之后执行showTime
}
/*//函数需要调用才会执行
showTime();
setInterval(showTime,1000);//在指定的时间(1秒)后,调用showTime函数*/
showTime();

你可能感兴趣的:(JavaScript,javascript)