18910140161

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

顺晟科技

2021-06-16 10:35:35

405

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

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

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

!DOCTYPEhtml

超文本标记语言

metacharset='utf-8'/

标题/头衔

/head

身体

div/div

脚本

var index=0;

vari=0;

/**

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

*/

functioncounter(){

第二=索引

分钟=I;

指数;

if(秒==60){

second=0;

我;

index=0;

}

if(second10){

秒='0 '秒;

}

if(分钟10){

分钟='0 '分钟;

}

returntime=分钟' : '秒;

}

/**

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

*/

functionshow(){

var time=counter();

文件。GetElementsBytagName(' div ')[0].innerHTML=时间;

}

/**

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

*/

functionset(){

setInterval('show()',1000);

}

show();

set();

/script

/body

/html

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

时钟功能的代码:

!DOCTYPEhtml

超文本标记语言

' UTF-8 '

标题/头衔

脚本

/**

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

*/

约会。原型。当前时间=函数(){

var year=this。GetFullyear();

var month=this。get month()1;

var day=this。GetDate();

var week=this。GetDay();

周='星期' '日一二三四五六charAt(周);

month=month10?' 0 '个月:个月;

day=day10?' 0 '天:天

var hour=this。gethours();

var second=这个。GetSeconds();

var minute=this。GetMinutes();

hour=hour10?0 '小时:小时;

秒=秒10?' 0 '秒:秒;

分钟=分钟10?0 '分钟:分钟;

返回年'-'月'-'日'周'小时' : '分钟' : '秒;

}

functionshowTime(){

vartime=newDate().当前时间();

document.getElementById('show ').innerHTML=时间;

}

functionsetTime(){

show time();

setInterval('showTime()',1000);

}

window.onload=function(){

setTime();

}

/script

/head

身体

spand=' show '/span

/body

/html

这样,时钟就完成了!

本文转载自中文网

相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航