Js实现时钟效果
在JavaScript中,有一个内置对象Date,它重要的一个作用就是实现了时间的时刻更新,通过代码来创造一个实实在在的时间表。
代码例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="author" content="惊风" />
<meta name="Genarator" content="sublime"/>
<title>时间的实现</title>
<style type="text/css">
#timetxt{
width:100px;
height:40px;
background-color:#EABC46;
font-size:20px;
line-height:40px;
margin:auto auto;
text-align:center;
}
</style>
<script type="text/javascript">
function startTime(){
var today=new Date(); //定义时间
var h=today.getHours(); //小时
var m=today.getMinutes(); //分钟
var s=today.getSeconds(); //秒
//调用函数
h=checkTime(h);
m=checkTime(m);
s=checkTime(s);
document.getElementById("timetxt").innerHTML=h+":"+m+":"+s; //时间显示的格式
t=setTimeout(function(){
startTime();
},500);//500,是延时显示的意思,即500毫秒更新一次
}
//当分钟和秒是一位时候,需要在前面加0(才更符合要求)
function checkTime(i){
if(i<10){
i="0"+i;
}
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="timetxt"></div>
</body>
</html>本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!