使用JavaScript在网页上动态显示时钟

最新推荐文章于 2019-09-25 17:03:28 发布

原创最新推荐文章于 2019-09-25 17:03:28 发布 · 2.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #stylesheet #function #html #date #div

JavaScript 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一个简单的HTML页面，该页面使用JavaScript来实现实时显示当前时间的功能。通过解析HTML文档结构及JavaScript代码，读者可以了解到如何设置HTML元信息、如何在页面加载时触发JavaScript函数以及如何获取并格式化显示当前时间。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Test02.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <script type="text/javascript">
    	function startTime(){
    		var today = new Date();
    		var h = today.getHours();
    		var m = today.getMinutes();
    		var s = today.getSeconds();
    		m = checkTime(m);
    		s = checkTime(s);
    		document.getElementById('time').innerHTML=h+":"+m+":"+s;
    		t = setTimeout('startTime()',500);
    	}
    	
    	function checkTime(i){
    		if(i<10){
    			i = "0" + i;
    		}
    		return i;
    	}
    </script>

  </head>
  
  <body onload="startTime()">
    <!-- This is my HTML page. <br> -->
    <div id="time"></div>
  </body>
</html>