原生javascript实现的能够自动变化的时间日期代码实例

原生javascript实现的能够自动变化的时间日期代码实例:
能够动态变化的事物总比静态的更能够吸引人,甚至更有实用效果,比如能够自动变化的时间日期效果就是如此,下面就通过代码实例介绍一下如何实现此效果,代码实例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<script type="text/javascript">
var t = null;
function time(){
  dt = new Date();
  var y=dt.getFullYear();
  var h=dt.getHours();
  var m=dt.getMinutes();
  var s=dt.getSeconds();
  document.getElementById("timeShow").innerHTML="当前时间:"+y+""+h+""+m+""+s+"";
  t = setTimeout(time,1000);        
} 
window.onload=function(){time()}
</script>
</head>
<body>
<div id="timeShow"></div>
</body>
</html>

以上代码实现了我们的要求,下面简单介绍一下实现过程。
一.实现原理:
time()函数能够获取当前时间日期,然后在函数最后使用定时器函数递归调用time()函数,也就是能够不断执行time()函数,于是也就实现了时间日期自动更新的凶过,这里就不多介绍了。
二.相关阅读:
1.事件对象可以参阅ECMAScript的Date对象一章节。 
2.setTimeout()函数可以参阅window对象的setTimeout()方法一章节。 
3.innerHTML属性可以参阅js的innerHTML属性的用法一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=11969

更多内容可以参阅:http://www.softwhy.com/javascript/

你可能感兴趣的:(原生javascript实现的能够自动变化的时间日期代码实例)