实时获取当前时间代码实例
分类:实例代码
本章节分享一段代码实例,它可以实时获取当前时间。
代码实例如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.pipipi.net/" /> <title>前端教程网</title> <style type="text/css"> #time{ background-color:#eee; } </style> <script type="text/javascript"> function showtime(){ var myDate = new Date(); document.getElementById("time").innerHTML = myDate.getHours() + "时" + myDate.getMinutes() + "分" + myDate.getSeconds() + "秒" ; setTimeout(showtime,1000); } window.onload=function(){ showtime(); } </script> </head> <body> <div id="time"></div> </body> </html>
上面的代码实现了我们的要求,下面介绍一下它的实现过程。一.代码注释:
(1).function showtime(){},此函数实现了相关功能。
(2).var myDate = new Date(),创建一个当前时间对象。
(3).document.getElementById("time").innerHTML = myDate.getHours()+ "时" + myDate.getMinutes() + "分"+ myDate.getSeconds() + "秒" ,获取小时、分钟和秒,并进行字符串连接操作。
(4).setTimeout(showtime,1000),采用递归的方式,每隔1秒调用一次showtime函数。
二.相关阅读:
(1).innerHTML可以参阅js innerHTML一章节。
(2).Date对象的更多内容可以参阅JavaScript Date对象一章节。
(3).setTimeout()方法可以参阅setTimeout()一章节。
一线大厂高级前端编写,前端初中阶面试题,帮助初学者应聘,需要联系微信:javadudu