实现JavaScript实时变化时间日期
分类：实例代码
JavaScript实时变化时间日期属于前端实例代码，有关更多实例代码大家可以查看。
现在网页都在最大程度的追求人性化，比如一个时间日期比较人性化的设置，能够实时获取当前客户端机器时间日期。
下面是一段这样的实例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<title>前端教程网</title>
<script type="text/javascript">
function printTime(){
var time=new Date();
var year=time.getFullYear();
var month=(time.getMonth())+1;
var daynum=time.getDay();
var hour=time.getHours();
var min = time.getMinutes();
var sec=time.getSeconds();
var da=time.getDate();
var daystr;
switch(daynum){
case 0: daystr="星期日";
break;
case 1: daystr="星期一";
break;
case 2: daystr="星期二";
break;
case 3: daystr="星期三";
break;
case 4: daystr="星期四";
break;
case 5: daystr="星期五";
break;
case 6: daystr="星期六";
break;
default: daystr="";
}
var str=year+"年"+month+"月"+da+"日 "+daystr+" "+hour+": "+min+": "+sec;
timer.innerHTML=str;
setTimeout(printTime,1000);
}
window.onload=function(){printTime();}
</script>
<body>
<div id="timer"></div>
</body>
</html>
能够实时的获取当地系统的时间日期，下面介绍一下它的时间过程。
一.实现原理：
原理大致是这样，创建一个函数，能够获取当前的系统时间，为了能够有实时变化效果，要每秒调用一次此函数，所以在函数的尾部使用setTimeout定时器函数递归调用函数本身。
二.代码注释：
（1）.时间日期相关方法参阅JavaScript Date对象一章节。
（2）.innerHTML属性可以参阅JavaScript innerHTML一章节。
（3）.setTimeout方法可以参阅window setTimeout()一章节。
JavaScript实时变化时间日期，这样的场景在实际项目中还是用的比较多的，关于JavaScript实时变化时间日期就介绍到这了。