js数字时钟

在网页中加入数字时钟既可以增加页面的活力，又可以方便浏览者。下面将通过一个具体实例介绍如何实现数字时钟，如图所示：

制作本实例的基本思路如下：首先需要在页面中添加7个images，主要用于显示两位数的时分秒以及am（上午）和pm（下午），然后在javascript所定义的函数中利用Date对象获得当前时

function clock()
{ 
    date=new Date();
    hour=date.getHours();
    minu=date.getMinutes();
    sec=date.getSeconds();
    if(sec<10)
        {sec="0"+sec;}
    if(minu<10) 
        {minu="0"+minu;}
    if(hour<10) 
        {hour="0"+hour;}
    time=hour+":"+minu+":"+sec;
    document.img1.src="images/Clock/c"+time.charAt(0)+".gif";
    document.img2.src="images/Clock/c"+time.charAt(1)+".gif";
    document.img3.src="images/Clock/c"+time.charAt(3)+".gif";
    document.img4.src="images/Clock/c"+time.charAt(4)+".gif";
    document.img5.src="images/Clock/c"+time.charAt(6)+".gif";
    document.img6.src="images/Clock/c"+time.charAt(7)+".gif";
    if(hour>12) 
    {document.img7.src="images/Clock/cpm.gif";}
    else 
    {document.img7.src="images/Clock/cam.gif";}
    setTimeout('clock()',1000); 
}

添加页面设计代码，当页面加载时调用clock（）函数。

<img name="img1" width="16" height="21"><img name="img2" width="16" height="21"><img src="images/Clock/colon.gif" width="9" height="21"><img name="img3" width="16" height="21"><img name="img4" width="16" height="21"><img src="images/Clock/colon.gif" width="9" height="21"><img name="img5" width="16" height="21" id="img5"><img name="img6" width="16" height="21" id="img6"><img src="images/Clock/cb.gif" width="16" height="21"><img name="img7" width="16" height="21" id="img7">