<！DOCTYPE html>
<html lang =“en”>
<HEAD>
<meta charset =“UTF-8”>
<meta name =“viewport”content =“width = device-width，initial-scale = 1.0”>
<meta http-equiv =“X-UA-Compatible”content =“ie = edge”>
<TITLE> text5 </ TITLE>
<SCRIPT>
function toDouble（num）{
if（num <10）{
返回'0'+ num;
} else {
return''+ num;
}
}
window.onload = function（）{
var oBtn = document.getElementById（'btn'）;
var aImg = document.getElementsByTagName（'img'）;
var i = 0;
oBtn.onclick = function（）{
var oDate = new Date（）;
var str = toDouble（oDate.getHours（））+ toDouble（oDate.getMinutes（））+ toDouble（oDate.getSeconds（））;
for（i = 0; i <aImg.length; i ++）{
aImg [i] .src ='img /'+ str.charAt（i）+'。png';
}
};
};
</ SCRIPT>
</ HEAD>
<body style =“color：blue; background：pink; font-size：50px;”>
<input id =“btn”type =“button”value =“更新时间”>
<img src =“img / 0.png”>
<img src =“img / 0.png”>点
<img src =“img / 0.png”>
<img src =“img / 0.png”>分
<img src =“img / 0.png”>
<img src =“img / 0.png”>秒
</ BODY>
</ HTML>
改善：
我们这个时钟是写了一个按钮的，那我总不能时时刻刻去点击这个按钮，那我们就请一个它来帮我点（定时器），去掉按钮，设置一个间隔型的定时器。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>text5</title>
<script>
function toDouble(num) {
if (num < 10) {
return '0' + num;
} else {
return '' + num;
}
}
window.onload = function() {
var oBtn = document.getElementById('btn');
var aImg = document.getElementsByTagName('img');
var i = 0;
function change() {
var oDate = new Date();
var str = toDouble(oDate.getHours()) + toDouble(oDate.getMinutes()) + toDouble(oDate.getSeconds());
for (i = 0; i < aImg.length; i++) {
aImg[i].src = 'img/' + str.charAt(i) + '.png';
}
};
setInterval(change, 1000)
// 特点：等一秒钟过去之后才调用change函数，这时就会有一个小问题，页面先出先全零的情况
change();
// 在页面加载完，就调用一次时间更新的动作
};
</script>
</head>
<body style="color:blue;background: pink;font-size:50px;">
<!-- <input id="btn" type="button" value="更新时间"> -->
<img src="img/0.png">
<img src="img/0.png"> 点
<img src="img/0.png">
<img src="img/0.png"> 分
<img src="img/0.png">
<img src="img/0.png"> 秒
</body>
</html>