JavaScript实例教程(十一)显示一个动态的时钟

无法无天巡警

无法无天巡警

2016-02-19 14:39

下面图老师小编跟大家分享JavaScript实例教程(十一)显示一个动态的时钟,一起来学习下过程究竟如何进行吧!喜欢就赶紧收藏起来哦~

前面说的显示当前时间日期是静态的,我们这里来实现一个动态的时钟。

在head和/head之间插入下列代码:

script
//定义时钟显示的函数
function displayTime() {
var today = new Date();
// 定义日期对象

var hours = today.getHours();
var minutes = today.getMinutes();
var seconds = today.getSeconds();
// 从日期对象中中获得时间信息

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

minutes = fixTime(minutes);
seconds = fixTime(seconds);
// 引入fixTime()函数,使分和秒可以正常显示,对于小于10的数字则在该数字前加一个0

var the_time = hours + ":" + minutes + ":" + seconds;
//将时间字符串组合在一起并写出
window.document.the_form.the_text.value = the_time;
//把表格的值重新写一遍,相当于刷新时间

the_timeout= setTimeout('displayTime();',500);
//每半秒钟执行一次该函数,即500毫秒
}
function fixTime(the_time)
{if (the_time 10) { the_time = "0" + the_time; } return the_time; }
/script

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

把body改为body onload=displayTime()

再在body标签间输入

欢迎光临5D多媒体 现在是北京时间:
form name="the_form"
pfont face="宋体"input type="text" name="the_text" size="16" /form

运行,可以看到浏览器显示如下:

JavaScript实例教程(十一)显示一个动态的时钟

展开更多 50%)
分享

猜你喜欢

JavaScript实例教程(十一)显示一个动态的时钟

Web开发
JavaScript实例教程(十一)显示一个动态的时钟

JavaScript实例教程(一)JavaScript简介

Web开发
JavaScript实例教程(一)JavaScript简介

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

flash教程时钟的实例教程

电脑应用
flash教程时钟的实例教程

Javascript实例教程(9) 随机显示图片

Web开发
Javascript实例教程(9) 随机显示图片

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Javascript实例教程(5) 在一个表单中设置和检查Cookies

Web开发
Javascript实例教程(5) 在一个表单中设置和检查Cookies

Javascript实例教程(16)

Web开发
Javascript实例教程(16)

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Oracle数据库手工扩大表空间

Oracle数据库手工扩大表空间

Win7资源管理器丰富功能轻松方便

Win7资源管理器丰富功能轻松方便
下拉加载更多内容 ↓