JavaScript动态显示当前日期时间与星期几
作者:页面旅途时间:2026-10-29 15:59:08浏览:497
本文介绍如何在网页中使用JavaScript动态显示当前日期时间和星期几。通过定义获取日期的函数并结合定时器,实现每秒刷新显示效果。代码示例展示了如何格式化年月日时分秒,并处理月份和日期的补零逻辑,同时利用数组映射星期数值为中文名称,最终将结果输出到指定DOM元素中。
JavaScript动态显示当前日期时间与星期几
在网页开发中,经常需要实时展示当前的日期和时间,并附带星期信息。具体的实现方案如下所示:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript">
function currentTime(){
var d=new Date(),str='';
str+=d.getFullYear()+'年';
str+=d.getMonth() + 1+'月';
str+=d.getDate()+'日';
str+=d.getHours()+'时';
str+=d.getMinutes()+'分';
str+= d.getSeconds()+'秒';
return str;
}
setInterval(function(){$('#time').html(currentTime)},1000);
</script>
</head>
<body>
<div id="time"></div>
</body>
</html>
若要在网页上实现日期时间的动态刷新显示,并同步展示星期信息,可以参考以下实现方式:
function showTime(){
var show_day=new Array('星期一','星期二','星期三','星期四','星期五','星期六','星期日');
var time=new Date();
var year=time.getYear();
var month=time.getMonth();
var date=time.getDate();
var day=time.getDay();
var hour=time.getHours();
var minutes=time.getMinutes();
var second=time.getSeconds();
month<10?month='0'+month:month;
month=month+1;
hour<10?hour='0'+hour:hour;
minutes<10?minutes='0'+minutes:minutes;
second<10?second='0'+second:second;
var now_time='当前时间:'+year+'年'+month+'月'+date+'日'+' '+show_day[day-1]+' '+hour+':'+minutes+':'+second;
document.getElementById('showtime').innerHTML=now_time;
setTimeout("showTime();",1000);
}
网络上关于此类功能的教程资源丰富,涵盖了获取当前日期时间、计算一周前时间等多种场景,这些资料具有较高的参考价值。建议开发者多阅读相关文章,熟练掌握此类常用技巧。
作者最新文章
JS监听滚动事件:回到顶部按钮的显示与隐藏逻辑
2026-11-05 16:19:37
JavaScript怎么读写LocalStorage与SessionStorage
2026-11-05 15:40:11
anime.js 与 GSAP 对比:轻量级项目该怎么选择动画库
2026-11-05 11:24:55
flv.js 与 hls.js 在直播场景下的选型对比
2026-11-05 08:18:52
JavaScript能做什么?前端开发中的作用与应用场景解析
2026-11-04 23:17:54
相关标签:
