编程 Javascript

简单的JS时钟实例讲解

Posted in Javascript onJanuary 13, 2016

本文实例介绍了JS时钟实现代码，分享给大家供大家参考，具体内容如下

效果图：

简单的JS时钟实例讲解

具体代码：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="gb2312">
  <title>Document</title>
  <script type="text/javascript">

    function startTime () {
       var today=new Date();
    var y=today.getFullYear();
    var mon=today.getMonth()+1;
       mon=changNum(mon);
    var d=today.getDay();
       d=changNum(d);
    var h=today.getHours();
    var m=today.getMinutes();
       m=changNum(m);
    var s=today.getSeconds();
       s=changNum(s);
    document.getElementById("timeid").innerHTML=y+"年"+mon+"月"+d+"日"+h+":"+m+":"+s;
    t=setTimeout(function(){
      startTime();
    },500);
    }    

   function changNum(i){   //月、日、秒如果小于10数字前加0
       if(i<10){
          return "0"+i;
       }
       return i;
   }

  </script>
</head>
<body onload="startTime()">

<h1 id="timeid"></h1>

</body>
</html>

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

简单的JS时钟实例讲解

- Author -

Superpan2015

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Javascript开发包大全整理

Dec 22 Javascript

jscript之Open an Excel Spreadsheet

Jun 13 Javascript

javascript数组去掉重复

May 12 Javascript

js常用代码段收集

Oct 28 Javascript

Jquery焦点与失去焦点示例应用

Jun 10 Javascript

AngularJS 日期格式化详解

Dec 23 Javascript

JavaScript表单验证的两种实现方法

Feb 11 Javascript

基于JavaScript实现多级菜单效果

Jul 25 Javascript

vue+swiper实现侧滑菜单效果

Dec 28 Javascript

Vue一个案例引发的递归组件的使用详解

Nov 15 Javascript

详解小程序input框失焦事件在提交事件前的处理

May 05 Javascript

微信小程序在线客服自动回复功能(基于node)

Jul 03 Javascript

基于jquery实现的仿优酷图片轮播特效代码

Jan 13 #Javascript

详解iframe与frame的区别

Jan 13 #Javascript

浅析JavaScript中的变量复制、参数传递和作用域链

Jan 13 #Javascript

Jquery uploadify上传插件使用详解

Jan 13 #Javascript

JavaScript类型检测之typeof 和 instanceof 的缺陷与优化

Jan 13 #Javascript

jquery对复选框(checkbox)的操作汇总

Jan 13 #Javascript

分享javascript计算时间差的示例代码

Mar 19 #Javascript

You might like

PHP中输出转义JavaScript代码的实现代码

2011/04/22 PHP

php学习笔记数组遍历实现代码

2011/06/09 PHP

通达OA公共代码 php常用检测函数

2011/12/14 PHP

thinkphp验证码的实现(form、ajax实现验证)

2016/07/28 PHP

PHP中md5()函数的用法讲解

2019/03/30 PHP

javascript实现颜色渐变的方法

2013/10/30 Javascript

jQuery仿gmail实现fixed布局的方法

2015/05/27 Javascript

JavaScript节点及列表操作实例小结

2015/08/05 Javascript

JS定时器用法分析【时钟与菜单中的应用】

2016/12/21 Javascript

JS中Select下拉列表类(支持输入模糊查询)功能

2017/01/17 Javascript

canvas绘图不清晰的解决方案

2017/02/28 Javascript

使用JavaScript实现表格编辑器(实例讲解)

2017/08/02 Javascript

Vue 2.5 Level E 发布了：新功能特性一览

2017/10/24 Javascript

Angular6中使用Swiper的方法示例

2018/07/09 Javascript

解决vue this.$forceUpdate() 处理页面刷新问题（v-for循环值刷新等）

2018/07/26 Javascript

React+Webpack快速上手指南(小结)

2018/08/15 Javascript

浅谈vux之x-input使用以及源码解读

2018/11/04 Javascript

Node.js操作系统OS模块用法分析

2019/01/04 Javascript

使用eslint和githooks统一前端风格的技巧

2020/07/29 Javascript

vue 使用class创建和清除水印的示例代码

2020/12/25 Vue.js

python3新特性函数注释Function Annotations用法分析

2016/07/28 Python

使用Python-OpenCV向图片添加噪声的实现(高斯噪声、椒盐噪声)

2019/05/28 Python

python判断是空的实例分享

2020/07/06 Python

五分钟学会怎么用Pygame做一个简单的贪吃蛇

2021/01/06 Python

css3.0 图形构成实例练习二

2013/03/19 HTML / CSS

加拿大当代时尚服饰、配饰和鞋类专业零售商和制造商：LE CHÂTEAU

2017/10/06 全球购物

测量工程专业求职信

2014/02/24 职场文书

2014国培学习感言

2014/03/05 职场文书

个人廉洁自律承诺书

2014/03/27 职场文书

药品营销策划方案

2014/06/15 职场文书

优秀中职教师事迹材料

2014/08/26 职场文书

关于群众路线的心得体会

2014/11/05 职场文书

2015年生活老师工作总结

2015/05/27 职场文书

预备党员介绍人意见

2015/06/01 职场文书

go原生库的中bytes.Buffer用法

2021/04/25 Golang

Python测试框架pytest高阶用法全面详解

2022/06/01 Python