这样例很easy。了解JavaScript之后就是几行的代码便可以完毕的事情。

可是对于一些未接触过JavaScript的人来说，差点儿非常大project的样子。然后在网上苦苦寻觅代码，之后在茫茫的html代码中寻求不到，终于得不到要领。

一、基本目标

实现一个随同client（浏览者机器上的）时间的网页文本时间。使用最短的代码。

二、制作过程

<!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对象假设使用没有參数的构造函数，就会返回client的时间，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】一个同步于本地时间的动态时间的更多相关文章

  1. 动态时间规整DTW(Dynamic Time Warping )

    动态时间规整DTW(Dynamic Time Warping ) 原文:https://blog.csdn.net/raym0ndkwan/article/details/45614813 算法笔记- ...

  2. cisco 交换机设置时区、时间、同步日志本地时间

    Core-Switch-1#show clockCore-Switch-1#show ntp statusCore-Switch-1#conf tCore-Switch-1(config)# cloc ...

  3. 第一百四十五节，JavaScript，同步动画

    JavaScript,同步动画 将上一节的,移动透明动画,修改成可以支持同步动画,也就是可以给这个动画方法多个动画任务,让它同时完成 原理: 向方法里添加一个属性,这个属性是一个对象,同步动画属性,属 ...

  4. 转自文翼的博客：将本地时间转换为 GMT 时间

    在写 RSS 订阅接口的时候,发现最终输出文章的 RSS 时间(GMT时间),在本地上显示的时间和在服务器上显示的时间不一致. 原因是时区不一致,那么在 JavaScript 中,如何将时间转换为统一 ...

  5. 【Android Developers Training】 96. 运行一个同步适配器

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...

  6. JavaScript+html5 canvas实现本地截图教程

    这篇文章主要介绍了JavaScript+html5 canvas实现本地截图教程,对截图功能感兴趣的小伙伴们可以参考一下 最近有时间了解了下html5的各API,发现新浪微博的头像设置是使用canva ...

  7. 使用JavaScript开发IE浏览器本地插件实例

    使用JavaScript开发IE浏览器本地插件实例 投稿:junjie 字体:[增加 减小] 类型:转载 时间:2015-02-18我要评论 这篇文章主要介绍了使用JavaScript开发IE浏览器本 ...

  8. PHP中关于时间、时区、本地时间、UTC时间、GMT时间、时间戳等知识的梳理

    在PHP开发中,我们经常会在时间问题上被搞糊涂,比如我们希望显示一个北京时间,但是当我们使用date函数进行输出时,却发现少了8个小时.几乎所有的php猿类都必须对php中几个重要的时间转换等方法进行 ...

  9. JavaScript有同步任务和异步任务，浏览器是怎么处理的？

    1.在讨论浏览器与JavaScript之前,我们先来简单了解一下进程与线程 进程(process):资源分配的最小单位 进程是应用程序的执行实例,是操作系统进行资源分配和调度的一个独立单位. 线程(t ...

随机推荐

  1. Express优化-合并路由

    原app.js var express = require('express'); var app = express(); /*start*/ app.get('/',function(req,re ...

  2. 微软对外披露两个0day漏洞详情

    微软近日对外披露了两个0day漏洞详情,其中一个漏洞存在Adobe阅读器中,可被利用导致任意代码执行:另一个漏洞则允许任意代码在Windows kernel内存中提权执行. 微软称由于该漏洞利用目前还 ...

  3. php+wamp环境部署本地Web应用

    1.创建新的项目(project),创建完成之后单击工具栏的应用运行/调试(Select Run/Debug Configuration)的下拉菜单弹出 Edit Cofigurations选项,单击 ...

  4. unity statics window fps原理

    https://forum.unity.com/threads/is-unity-fps-count-wrong-or-am-i-missing-something.150139/ 看了下这个fps ...

  5. http://blog.csdn.net/congcong68/article/details/39256307

    http://blog.csdn.net/congcong68/article/details/39256307

  6. WebService基于SoapHeader实现安全认证[webservice][.net][安全][soapheader]

    摘 自: http://blog.sina.com.cn/s/blog_72b7a82d0100yyp8.html WebService基于SoapHeader实现安全认证[webservice][. ...

  7. linux系统下mysql跳过密码验证登录和创建新用户

    修改MySQL的登录设置: # vi /etc/my.cnf 在[mysqld]的段中加上一句:skip-grant-tables 例如: [mysqld] datadir=/var/lib/mysq ...

  8. js 修改css属性值

    js不能修改样式表 但是可以修改元素:比如 <div id="test" class="star-rating"></div> 对于上面 ...

  9. mysql有关问题之：the security settings could not be applied to

    mysql问题之:the security settings could not be applied to 转自:http://www.myexception.cn/mysql/503556.htm ...

  10. java中异常介绍

    一.异常概述 异常处理已经成为衡量一门语言是否成熟的标准之一,目前的主流编程语言如C++.C#.Ruby.Python等,大都提供了异常处理机制.增加了异常处理机制后的程序有更好的容错性,更加健壮. ...