这样例很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. WindowsServices_无法拷贝文件到服务器

    方法一:驱动器勾选   方法二:rdpclip.exe进程 1.现在进程管理中结束所有的rdpclip.exe进程 2.在运行中执行 rdpclip.exe接口    

  2. Unity3d-Socket之龙一编年史network.dll分析(1)

    今天闲着无聊,看到群里的老大共享了反编译的工具,就下载下来玩下. 说道反编译我个人不太推崇反编译,感觉不道德,毕竟是人家的代码,但是又回想一下,我们拿代码看是抱着学习的态度又有何不可,所谓既是民族的也 ...

  3. JSON相关

  4. Android疑难杂症之KillProcess 和System.exit 无效

    以下所讲,浓缩在 https://github.com/wytings/CrashDemo 首先就这个名字来说,kill了process 或者 system.exit确实已经把APP杀掉了,特别是当你 ...

  5. Android-Universal-Image-Loader载入图片

    直接看代码:MainActivity: package com.example.textwsjdemo; import com.nostra13.universalimageloader.cache. ...

  6. [转]SSIS中的脚本—脚本任务

    本文转自:http://www.cnblogs.com/tylerdonet/archive/2011/09/16/2179123.html 脚本任务主要用来控制数据流,当现有的控制流 任务不能满足复 ...

  7. LESS,强大的CSS预处理语言

    虽然写的css不多,但是我已经切身感觉到了书写css的恶心...抛开最令人烦的浏览器兼容问题不说,这个语言本身就有不少问题. 最简单的,比如多个地方是同一个颜色的,如果可以写在一个样式里还没什么,但是 ...

  8. xss编码小结

    一.JS编码与HTML编码区分: HTML实体可以使用十进制与十六进制编码:javascript可以使用Unicode与八进制与十六进制进行编码. 二.编码原理区分: 三.编码与非编码 对于JS编码: ...

  9. UVa 615 - Is It A Tree?

    题目:给你一些有向边(端点,长度为1).推断给定的图是否是一棵树. 分析:图论.并查集.树是一个全部点都连接的有向无环图(不连接的是森林). 依照树的定义推断是否有环就可以,有环分成两种: 1.链状环 ...

  10. BS中保存参数

    开发中经常需要将值存起来,当点击某一项时以便知道点击了哪一项. 一:应用JS页面跳转(牛腩中讲到) HTML: <td class="txt c"><a href ...