html如何实现字数计数,html如何实现计数器以及时钟的功能代码

本篇文章给大家带来的内容是关于html如何实现计数器以及时钟的功能代码，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

在许多的网页中，我们都会看到计数器以及时钟，那么我们怎么自己实现着种功能呢？

先说计数器，计数器的逻辑功能很简单，就是秒针每秒加一，逢60进一就可以。代码如下：

varindex=0;

vari=0;

/**

*对时间进行预先处理，逢60进一

*/

functioncounter(){

second=index;

minute=i;

index++;

if(second==60){

second=0;

i++;

index=0;

}

if(second<10){

second="0"+second;

}

if(minute<10){

minute="0"+minute;

}

returntime=minute+":"+second;

}

/**

*将获得的时间插入到div的区域

*/

functionshow(){

vartime=counter();

document.getElementsByTagName("div")[0].innerHTML=time;

}

/**

*每秒钟获得一次时间，实现计数功能

*/

functionset(){

setInterval("show()",1000);

}

show();

set();

这样，一个简单的计数器就完成了。

时钟功能的代码：

/**

*向Date类中添加获取当前时间的方法

*/

Date.prototype.currentTime=function(){

varyear=this.getFullYear();

varmonth=this.getMonth()+1;

varday=this.getDate();

varweek=this.getDay();

week="星期"+"日一二三四五六".charAt(week);

month=month<10?"0"+month:month;

day=day<10?"0"+day:day;

varhour=this.getHours();

varsecond=this.getSeconds();

varminute=this.getMinutes();

hour=hour<10?"0"+hour:hour;

second=second<10?"0"+second:second;

minute=minute<10?"0"+minute:minute;

returnyear+"-"+month+"-"+day+""+week+""+hour+":"+minute+":"+second;

}

functionshowTime(){

vartime=newDate().currentTime();

document.getElementById("show").innerHTML=time;

}

functionsetTime(){

showTime();

setInterval("showTime()",1000);

}

window.οnlοad=function(){

setTime();

}

这样，时钟就完成了！

本文转载自中文网