这样例很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. Web安全开发指南--异常错误处理与日志审计

    1.异常错误处理与日志审计 5.1.日志审计系统安全规则 1 日志系统能够记录特定事件的执行结果(比如 成功或失败). 确保日志系统包含如下重要日志信息: 1.  日志发生的时间: 2.  事件的严重 ...

  2. Delphi 实现多线程编程的线程类 TThread

    http://blog.csdn.net/henreash/article/details/3183119 Delphi中有一个线程类TThread是用来实现多线程编程的,这个绝大多数Delphi书藉 ...

  3. JS的jsoneditor,用来操作Json格式的界面;json-editor用来根据json数据生成界面

    1.jsoneditor https://github.com/josdejong/jsoneditor https://jsoneditoronline.org/ 效果如下: 2.json-edit ...

  4. java界面编程(3) ------ 控制布局

    本文是自己学习所做笔记,欢迎转载,但请注明出处:http://blog.csdn.net/jesson20121020 在java 中,组件放置在窗口上的方式可能与其它的GUI系统都不同样.首先,它全 ...

  5. @RestController和@Controller的差异

    SpringMVC现在使用越来越普及,在使用注解写控制器中发现,需要控制器页面跳转时,需要对类注解为@Controller,而此时,使用freemarker时,在类中写的restful接口会报cann ...

  6. gmock学习01---Linux配置gmock

    本文目的 本文主要介绍gmock 1.6.0版本在Linux上如何部署和使用. gmock是做什么的? 使用C++手动编写mock对象将会是一件十分耗时,易于出错,枯燥乏味的事情.gmock提供一整套 ...

  7. python微信公众号开发学习记录

    网上有很多微信公众号的开发教程,但是都是好几年前的了,而且很多都是抄袭其他人的,内容几乎一模一样.真的无语了.只好自己总结一下开发的一些简单流程. 一先去注册个微信公众号,这个就不详细说了, 二登录后 ...

  8. 【实践】用for-in 循环实现三联联动

    之前用jq 做过一次三联联动以及四联联动 现在为了更好地了解对象用js的原生方式做了一次 *本节要点方法:  obj.selectedIndex  获取下拉列表选中的option 的索引  obj.o ...

  9. 几个免费的DNS地址

    百度CDN 180.76.76.76 114.114.114.114 阿里CDN 223.5.5.5 223.6.6.6 googleCDN 8.8.8.8 国内外DNSserver地址列表 http ...

  10. TestNG系列之四: TestNg依赖 dependsOnMethods

    有时候,你可能需要在一个特定的顺序调用方法 执行原则: 1.被依赖的先执行: 2. 再执行没配置依赖的, 3.再执行需要依赖的: 4.若无依赖关系,依次执行) 一个方法有多个依赖时用空格隔开 有两种依 ...