js实现动态显示时间
Posted 独挽离人
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js实现动态显示时间相关的知识，希望对你有一定的参考价值。
思路：
*得到当前时间
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>
以上是关于js实现动态显示时间的主要内容，如果未能解决你的问题，请参考以下文章