简单的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 相关文章推荐
jQuery AJAX 调用WebService实现代码
Mar 24 Javascript
jQuery实现用户注册的表单验证示例
Aug 28 Javascript
jquery单选框radio绑定click事件实现方法
Jan 14 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
Sep 08 Javascript
关于JS Lodop打印插件打印Bootstrap样式错乱问题的解决方案
Dec 23 Javascript
jQuery开源组件BootstrapValidator使用详解
Jun 29 jQuery
浅谈angular2 组件的生命周期钩子
Aug 12 Javascript
如何获取TypeScript的声明文件.d.ts
May 01 Javascript
Vue瀑布流插件的使用示例
Sep 19 Javascript
JavaScript惰性载入函数实例分析
Mar 27 Javascript
一篇文章弄懂javascript中的执行栈与执行上下文
Aug 09 Javascript
Vue.Draggable实现交换位置
Apr 07 Vue.js
基于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
玩转图像函数库―常见图形操作
2006/09/03 PHP
用PHP查询搜索引擎排名位置的代码
2010/01/05 PHP
PHP中判断变量为空的几种方法分享
2013/08/26 PHP
ThinkPHP使用心得分享-分页类Page的用法
2014/05/15 PHP
ThinkPHP的cookie和session冲突造成Cookie不能使用的解决方法
2014/07/01 PHP
js表格分页实现代码
2009/09/18 Javascript
jquery 与NVelocity 产生冲突的解决方法
2011/06/13 Javascript
不使用XMLHttpRequest实现异步加载 Iframe和script
2012/10/29 Javascript
jquery post方式传递多个参数值后台以数组的方式进行接收
2013/01/11 Javascript
jquery动态添加元素事件失效问题解决方法
2014/05/23 Javascript
JS中的进制转换以及作用
2016/06/26 Javascript
HTML5 js实现拖拉上传文件功能
2020/11/20 Javascript
vue.js实现备忘录功能的方法
2017/07/10 Javascript
Vue2 模板template的四种写法总结
2018/02/23 Javascript
vue2.x集成百度UEditor富文本编辑器的方法
2018/09/21 Javascript
详解vue 自定义组件使用v-model 及探究其中原理
2019/10/11 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
在Vue项目中,防止页面被缩放和放大示例
2019/10/28 Javascript
解决vue.js提交数组时出现数组下标的问题
2019/11/05 Javascript
[02:05]2014DOTA2西雅图邀请赛 老队长全明星大猜想谁不服就按进显示器
2014/07/08 DOTA
Python实现遍历数据库并获取key的值
2015/05/17 Python
python实现发送邮件功能
2017/07/22 Python
Python拼接字符串的7种方法总结
2018/11/01 Python
python使用itchat模块给心爱的人每天发天气预报
2019/11/25 Python
Python递归函数特点及原理解析
2020/03/04 Python
Python内置方法和属性应用:反射和单例(推荐)
2020/06/19 Python
windows系统Tensorflow2.x简单安装记录(图文)
2021/01/18 Python
一文读懂python Scrapy爬虫框架
2021/02/24 Python
html5适合移动应用开发的12大特性
2014/03/19 HTML / CSS
女方婚礼新郎答谢词
2014/01/11 职场文书
文明教师事迹材料
2014/01/16 职场文书
社保转移委托书范本
2014/10/08 职场文书
副总经理岗位职责
2015/02/02 职场文书
药店营业员岗位职责
2015/04/14 职场文书
早会开场白台词大全
2015/06/01 职场文书
创业计划书之养殖业
2019/10/11 职场文书