1 <!doctype html>2 <meta charset="UTF-8">3 <html>4 <header></header>5 <body>6 7
顺晟科技
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
这样,时钟就完成了!
本文转载自中文网
15
2022-09
15
2022-09
15
2022-09
15
2022-09
15
2022-09
15
2022-09