手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JavaScript实现同步于本地时间的动态时间显示方法
JavaScript实现同步于本地时间的动态时间显示方法
摘要:本文实例讲述了JavaScript实现同步于本地时间的动态时间显示方法。分享给大家供大家参考。具体分析如下:动态显示时间的例子非常简单,了解...

本文实例讲述了JavaScript实现同步于本地时间的动态时间显示方法。分享给大家供大家参考。具体分析如下:

动态显示时间的例子非常简单,了解JavaScript之后就是几行的代码便能够完成的事情,

但是对于一些未接触过JavaScript的人来说,几乎很大工程的样子,然后在网上苦苦寻觅代码,之后在茫茫的html代码中寻求不到,最终得不到要领。

一、基本目标

实现一个随同客户端(浏览者机器上的)时间的网页文本时间,使用最短的代码。

二、制作过程

复制代码 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>jsclock</title>

</head>

<body>

<script type="text/javascript">

function clock() {

var time = new Date().toLocaleString();

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

}

setInterval("clock()", 1000);

</script>

<span id="clock"></span>

</body>

</html>

1. Date对象如果使用没有参数的构造函数,就会返回客户端的时间,toLocaleString()方法就是把时间转化成本地显示时间的格式,如果仅仅是toString()方法则只把时间转化成一个英语写法的时间字符串。同时,亲自实现发现toLocaleTimeString()方法是不存在的,请不要折腾。如果对于系统自带的方法转化出来的时间不满意,请使用各类的getDay(),getMonth(),getFullYear()等方法去构造字符串。再次不作展示。

2. innerHTML相当于id为clock其下的所有元素,document.getElementById("clock").innerHTML = time;一句的含义就把<span id="clock"></span>两标签中所夹的东西变为time字符串的内容

3.本JavaScript的关键在于setInterval("clock()", 1000);函数,意思为每1000毫秒,也就是每1秒,把clock()函数执行一次。也就是每一秒把<span id="clock"></span>两标签中所夹的东西变为time字符串的内容更新一次。

希望本文所述对大家的javascript程序设计有所帮助。

【JavaScript实现同步于本地时间的动态时间显示方法】相关文章:

Javascript实现飞动广告效果的方法

javascript中动态函数用法

Node.js中JavaScript操作MySQL的常用方法整理

JavaScript中的pow()方法使用

JavaScript检测鼠标移动方向的方法

javascript实现可全选、反选及删除表格的方法

用JavaScript实现对话框的教程

javasript实现密码的隐藏与显示

javascript动态创建链接的方法

javascript实现Table排序的方法

精品推荐
分类导航