网页时钟:将时间展示在页面上,点击按钮则将时间展示在页面上,在这里我就将时间展示在div内;
(1)首先是要展示当前时间;然后就是每个一秒展示一下时间;
(2)我们可以写一个方法专门用来展示时间,这里我就用showTime()方法来展示时间;
(3)接下来就是写showTime方法体了,这里可以分为四步如下:
a.获取当前时间 var nowTime=new Date();
b.将当前是将转化为当地时间字符串 var strNowTime=nowTime.toLoacleString();
c.获取用来展示时间的div对象 var myDiv=document.getElementById("div的id");
d.将当地时间字符串展示在div内 myDiv.innerHTML=strNowTime;
(4)接下来用一个方法start()每隔一秒展示一下时间了,也就是每个一秒调用一下showTime()方法;window.setInerval("showTime()",1000);
(5)一旦展示时间按钮就调用start按钮即可;
代码如下:
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <title>无标题文档</title> 7 8 <script type="text/javascript"> 9 10 function showTime(){ 11 12 var myDiv=document.getElementById("myDiv");//获取diV对象 13 var nowTime=new Date(); 14 var strNowTime=nowTime.toLocaleString();//将时间转化为当地字符串时间 15 16 myDiv.innerHTML=strNowTime;//将当地字符串时间展示在div内 17 18 } 19 20 function start(){//每个一秒显示一下时间 21 22 window.setInterval("showTime()",1000); 23 24 } 25 26 27 28 </script> 29 30 </head> 31 32 <body> 33 34 <input type="button" value="显示时间" onclick="start()"/> 35 <div id="myDiv"></div> 36 37 </body> 38 </html>