这样例很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. Inno Setup入门（二十四）——Inno Setup类参考（10）

    这里介绍一下FolderTreeView 类. TFolderTreeView = class(TCustomFolderTreeView)   property OnChange: TNotifyE ...

  2. TSQL语言基础笔记之单表查询

    db_id()函数 返回对象的id,如果返回的对象为null,则判断不存在 if db_id('testdb') is null --判断数据库是否存在 create database testdb ...

  3. linux下的udev是干嘛的,能否说的通俗点

    转:http://www.360doc.com/content/11/0415/21/1317564_109924863.shtml 早期的linux的/dev目录下有一大堆设备文件,不管你的主机上是 ...

  4. appium+python自动化47-首次打开app权限弹窗问题

    前言 用真机运行appium代码,首次打开app有的手机会出现权限弹窗问题,一般这种弹窗都是在引导页前面或者引导页后面出现.权限弹窗上面的按钮都是固定的, 只需要定位到"始终允许" ...

  5. ElasticSearch调优问题

    1. 近期遇到一个ES内存居高不下的问题,查了查,发现ES有个fielddata,当你发起一个查询,分析字符串的聚合将会被加载到 fielddata,如果这些字符串之前没有被加载过.如果结果中 fie ...

  6. 十四.spring-boot使用mybatis

    在springMVC+spring中使用mybatis已经非常非常的灵活,但是需要配置很多的信息 一.创建maven web project 二.创建数据库表 三.在application.prope ...

  7. 用BETTERCAP和RASPBERRY PI ZERO W制作迷你WiFi干扰器

    我并不是一个特别勤快的人,几天前我终于开始将我几周以来的一些想法付诸于实践,即使用Raspberry Pi Zero W制作一个可随身携带的迷你WiFi干扰器.有了它,我就可以随时随地的收集附近无线接 ...

  8. 线程局部存储（TLS）

    线程局部存储(TLS) 2011-10-11 09:59:28|  分类: Win32---API |  标签:tls   |举报 |字号 订阅   什么是线程局部存储 众所周知,线程是执行的单元,同 ...

  9. 【Linux】Ubuntu vi 上下左右变ABCD及 apt-get install报错问题解决方法

    新装的ubuntu12.04,本人绝对新手,在使用VI编辑器编辑文本时觉得实在是难用,因此找了几个解决方法如下: 1. 安装vim full版本 由于Ubuntu预安装的是tiny版本,就会导致我们在 ...

  10. 批处理文件——多个QQ一键登录

    偶然看到有的同学登录PC的QQ,发现他有很多QQ,每登录一个要切换一个,虽然记住了密码,但还是不方便,于是想通过批处理来实现“一键登录”的功能.以下内容为本文假想,如有雷同,实属巧合! 具体的实现步骤 ...