js实现计时器,练习使用js函数
作者:@kuaiquxie
作者的github:https://github.com/bitebita
本文为作者原创,如需转载,请注明出处:https://www.cnblogs.com/dzwj/p/16073747.html
js实现计时器
使用函数:
Date()
getFullYear()
getMonth()
getDay()
getHours()
getMinutes()
getSeconds()
代码展示:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>定时器</title> <script type="text/javascript"> function getTime() { var dateObj = new Date(); var year = dateObj.getFullYear();//年 var month = dateObj.getMonth()+1;//月 (注意:月份+1) var date = dateObj.getDate();//日 var day = dateObj.getDay(); var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]; var week = weeks[day];//根据day值,获取星期数组中的星期数。 var hours = dateObj.getHours();//小时 var minutes = dateObj.getMinutes();//分钟 var seconds = dateObj.getSeconds();//秒 if(month<10){ month = "0"+month; } if(date<10){ date = "0"+date; } if(hours<10){ hours = "0"+hours; } if(minutes<10){ minutes = "0"+minutes; } if(seconds<10){ seconds = "0"+seconds; } var newDate = year+"年"+month+"月"+date+"日"+hours+":"+minutes+":"+seconds+"   "+week; document.getElementById("date1").innerHTML = "时间显示:" + newDate;//在div中写入时间 setTimeout('getTime()', 500);//每隔500ms执行一次getTime() } </script> <style> #date1{ width: 600px; height: 100px; text-align: center; line-height: 100px; margin: 100px auto; border: 1px solid black; } </style> </head> <body onLoad="getTime()"> <div id="date1">时间</div> </body> </html>
运行截图:
体会:练习使用js代码实现具体功能。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· winform 绘制太阳,地球,月球 运作规律
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 上周热点回顾(3.3-3.9)
· AI 智能体引爆开源社区「GitHub 热点速览」