用js写时钟Demo
css代码：
<style type=”text/css”>
.a {
width: 200px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -100px;
margin-top: -50px;
line-height: 100px;
border-radius: 20px;
background: #333;
color: chartreuse;
font-size: 40px;
cursor: pointer;
text-align: center;
transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
box-shadow: 10px 10px 50px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 10px 10px 50px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 10px 10px 50px rgba(0, 0, 0, 0.6);
}
.a:hover {
color: aqua;
}
</style>
html代码：
<div class=”a” id=”time”></div>
js代码：
<script>
//获取改变的div
time = document.getElementById(“time”);
//封装函数
function shenTime() {
var mydate = new Date();
hours = mydate.getHours();
//判断小时小于10在前面加上0
if(hours<10)
{
hours=”0″+hours;
}
minutes = mydate.getMinutes();
if(minutes<10)
{
minutes=”0″+minutes;
}
seconds = mydate.getSeconds();
if(seconds<10)
{
seconds=”0″+seconds;
}
mytime = hours + “:” + minutes + “:” + seconds;
//改变值
time.innerHTML = mytime;
document.title=mytime;
}
//调用时钟函数
shenTime();
//定时器每秒循环时钟函数
setInterval(function () {
shenTime();
}, 1000);
</script>
时钟图片：
版权声明：本文为afew原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。