简单的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程序设计有所帮助。

Javascript 相关文章推荐
window.location.href IE下跳转失效的解决方法
Mar 27 Javascript
如何解决vue与传统jquery插件冲突
Mar 20 Javascript
深入浅出es6模板字符串
Aug 26 Javascript
JS解决position:sticky的兼容性问题的方法
Oct 17 Javascript
cordova入门基础教程及使用中遇到的一些问题总结
Nov 14 Javascript
基于 flexible 的 Vue 组件:Toast -- 显示框效果
Dec 26 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
Jan 18 Javascript
详解微信小程序实现WebSocket心跳重连
Jul 31 Javascript
layui 实现table翻页滚动条位置保持不变的例子
Sep 05 Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 Javascript
如何使用gpu.js改善JavaScript的性能
Dec 01 Javascript
低门槛开发iOS、Android、小程序应用的前端框架详解
Oct 16 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设计模式之结构模式的深入解析
2013/06/13 PHP
PHP获取当前日期所在星期(月份)的开始日期与结束日期(实现代码)
2013/06/18 PHP
Drupal7连接多个数据库及常见问题解决
2014/03/02 PHP
jquery的flexigrid无法显示数据提示获取到数据
2013/07/19 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
2013/12/05 Javascript
原生js仿jquery animate动画效果
2016/07/13 Javascript
原生JS中slice()方法和splice()区别
2017/03/06 Javascript
深入探究AngularJs之$scope对象(作用域)
2017/07/20 Javascript
vue在使用ECharts时的异步更新和数据加载详解
2017/11/22 Javascript
Vue循环组件加validate多表单验证的实例
2018/09/18 Javascript
JavaScript从原型到原型链深入理解
2019/06/03 Javascript
Node.js实现简单管理系统
2019/09/23 Javascript
微信小程序实现自定义底部导航
2020/11/18 Javascript
深入理解Python3中的http.client模块
2017/03/29 Python
python与sqlite3实现解密chrome cookie实例代码
2018/01/20 Python
python爬取淘宝商品销量信息
2018/11/16 Python
python批量下载网站马拉松照片的完整步骤
2018/12/05 Python
python+selenium 定位到元素,无法点击的解决方法
2019/01/30 Python
python调用虹软2.0第三版的具体使用
2019/02/22 Python
IntelliJ 中配置 Anaconda的过程图解
2020/06/01 Python
2021年的Python 时间轴和即将推出的功能详解
2020/07/27 Python
canvas需要在标签里直接定义宽高
2014/12/17 HTML / CSS
全球领先的各类汽车配件零售商:Advance Auto Parts
2016/08/26 全球购物
日本整理专家Marie Kondo的官方在线商店:KonMari
2020/06/29 全球购物
软件测试工程师面试问题精选
2016/10/28 面试题
工程现场管理求职自荐信
2013/10/02 职场文书
综合办公室个人的自我评价
2013/12/22 职场文书
投资合作协议书范本
2014/04/17 职场文书
幼儿园安全生产月活动总结
2014/07/05 职场文书
船舶工程技术专业求职信
2014/08/07 职场文书
英语课前三分钟演讲稿(6篇)
2014/09/13 职场文书
交通事故赔偿协议书
2014/10/16 职场文书
2016计算机专业毕业生自荐信
2016/01/28 职场文书
2019垃圾分类宣传口号汇总
2019/08/16 职场文书
css3 filter属性的使用简介
2021/03/31 HTML / CSS
mysql 排序失效
2022/05/20 MySQL