数字时钟
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>定时器的应用1</title>
<script src="JQuery.js"></script>
<style type="text/css">
<!-- 给时钟设置一点简单的样式 -->
.div1 {
text-align: center;
font-size: 100px;
color: red;
background-color: black;
font-weight: 900;
margin-top: 200px;
}
.div1 span {
margin-right: 20px;
}
</style>
</head>
<body>
<div class="div1">
<span>00</span>:
<span>00</span>:
<span>00</span>
</div>
<script>
<!-- 用于判断是否小于十,小于十就在前面加个0,美观 -->
function dodoke(n){
if(n < 10) {
return "0" + n;
}else{
return "" + n;
}
}
<!-- 给每个span的html()赋值为当前的时分秒,并且调用上面的函数判断是否为小于十的数 -->
function time(){
var low = new Date();
$("span").eq(0).html(dodoke(low.getHours()));
$("span").eq(1).html(dodoke(low.getMinutes()));
$("span").eq(2).html(dodoke(low.getSeconds()));
}
<!-- 把time函数放到定时器里每秒钟获取一次时间 -->
setInterval(time,1000);
time();
</script>
</body>
</html>