纯js数字时钟

最新推荐文章于 2022-09-26 12:55:24 发布

ChinaLzw

最新推荐文章于 2022-09-26 12:55:24 发布

阅读量1.4k

点赞数

分类专栏： javascript

本文为博主原创文章，只为分享而编，欢迎各位学习以及转载。

本文链接：https://blog.csdn.net/qq285679784/article/details/41776791

版权

javascript 专栏收录该内容

125 篇文章 2 订阅

订阅专栏

QQ：285679784 欢迎加入技术交流QQ群80669150 一起学习 !

<!doctype html>

<html lang="cn">
<head>
<title>数字时钟效果</title>

<script type="text/javascript">

window.οnlοad=function(){
setInterval("getTimes();", 1000);
}

function getTimes()
{
var oClock = document.getElementById("clock");
var aSpan = oClock.getElementsByTagName("span");
var aData = document.getElementById("Data");

var oDate = new Date();
var aDate = [oDate.getHours(), oDate.getMinutes(), oDate.getSeconds()];
for (var i in aDate) {aSpan[i].innerHTML = format(aDate[i])}

this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[oDate.getDay()];

aData.innerText=oDate.getFullYear()+"年"+(oDate.getMonth() + 1)+"月"+oDate.getDate()+"日 "+this.day+" ";
}
function format(a)
{
return a.toString().replace(/^(\d)$/, "0$1")
}
</script>

</head>
<body>
<div id="clock" style="font-family: 楷体; font-size: 15px; font-weight: bold; color:Gray;">
<label id="Data">
</label>
<span></span>:<span></span>:<span></span>
</div>
</body>
</html>