时钟demo

var hour = document.getElementsByClassName('hour')[0];
var min = document.getElementsByClassName('min')[0];
var sec = document.getElementsByClassName('sec')[0];

timer = setInterval(function(){
        var mydate = new Date();
        var timer = null;
        hour.innerHTML = zero(mydate.getHours());
        min.innerHTML  = zero(mydate.getMinutes());
        sec.innerHTML  = zero(mydate.getSeconds());
            
  },1000);

        function zero(a){
            if(a<10){
                a='0'+a;
            }else{
                a=''+a;
            }
            return a;
        }//给出现个位数的时候补零

效果图：

通过改变div里面的数值，直接通过innerHTML赋值进行的，还算简单。
老师的是一个数字对应一张图片，通过改变图片路径来显示对应的数字

 function zero(a){
            if(a<10){
                a='0'+a;
            }else{
                a=''+a;
            }
            return a;
        }
      
        var span1 = document.getElementsByClassName('span1')[0];
        var aimg =document.getElementsByTagName('img');
        setInterval(function(){
            var mydate = new Date();
            var str = zero(mydate.getHours())+zero(mydate.getMinutes())
                    +zreo(mydate.getSeconds());
            
            for(var i = 0; i<aimg.length; i ++){
                aimg[i].src='img/'+str[i]+'.png';
            }
            },1000);