js实现动态显示时间

it2022-05-05  78

思路:

*得到当前时间

  var date = new Date();

  //格式化为本地时间

  var d1 = date.toLocaleString();

*使页面每秒显示一次时间

  setInterval()  定时器实现

*显示到页面

  获取div标签并将时间写入

代码:

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>动态显示时间</title> 6 7 <style type="text/css"> 8 #times{ 9 width: 200px; 10 height: 20px; 11 border: 3px solid gray; /*如果不加实线无法显示边框*/ 12 } 13 </style> 14 </head> 15 16 <body> 17 <div id="times"> 18 19 </div> 20 21 <script type="text/javascript"> 22 //得到时间并写入div 23 function getDate(){ 24 //获取当前时间 25 var date = new Date(); 26 //格式化为本地时间格式 27 var date1 = date.toLocaleString(); 28 //获取div 29 var div1 = document.getElementById("times"); 30 //将时间写入div 31 div1.innerHTML = date1; 32 } 33 //使用定时器每秒向div写入当前时间 34 setInterval("getDate()",1000); 35 </script> 36 </body> 37 </html>

 

转载于:https://www.cnblogs.com/yuer20180726/p/11152208.html

相关资源:html中javascript实现网页动态显示时间

最新回复(0)