js实现一个简单的数字时钟效果
程序员文章站
2022-06-21 09:19:34
效果图:
代码如下:
效果图:
代码如下:
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>一个简单的数字时钟</title> <script type="text/javascript" charset="utf-8"> // 定义一个函数用以显示当前时间 function displaytime() { var elt = document.getelementbyid("clock"); // 通过id= "clock"找到元素 var now = new date(); // 得到当前时间 elt.innerhtml = now.tolocaletimestring(); //让elt来显示它 settimeout(displaytime,1000); //在1秒后再次执行 } window.onload = displaytime; //当onload事件发生时开始显示时间 </script> <style type="text/css" media="all"> #clock { font: bold 24pt sans; background: #ddf; padding: 10px; border: 2px solid black; border-radius: 10px; } </style> </head> <body> <h1>一个简单的数字时钟</h1> <span id="clock"></span> </body> </html>
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!