javascript实现模拟时钟的方法


Posted in Javascript onMay 13, 2015

本文实例讲述了javascript实现模拟时钟的方法。分享给大家供大家参考。具体实现方法如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>javascript模拟时钟</title>
 <!--Javascript示例代码解释:
 这个示例用到了Javascript内置对象Date的getFullYear,
 getMonth和getDate方法。首先申明一个变量d,var d = new Date(),
 表示将当天的日期值赋给变量d。然后使用getFullYear得到年份的值,
 用getMonth得到月份值(注:getMonth返回值范围为0到11,
 所以要得到实际的月份,还要加1),
 用getDate得到当天日期所在月份的日期值。
 这个示例还用到了"test?语句1:语句2",
 意思是如果符合test条件,那么执行语句1,
 否则使用语句2。计算月和日都用到了这个语法,
 如果月和日小于10,在月和日的值之前应该加0。=-->
 <script type="text/javascript">
  function Format2Len(i) {
//   if (i < 10) {
//    return "0" + i;
//   }
//   else {
//    return i;
   //   }
   return i < 10 ? "0" + i : i;
  }
  function RefreshClock() {
   var CurrentTime = new Date();
   var timeStr = CurrentTime.getFullYear() + "-" +
     Format2Len(CurrentTime.getMonth()+1) + "-" +
     Format2Len(CurrentTime.getDate()) + " " +
     Format2Len(CurrentTime.getHours()) + ":" +
     Format2Len(CurrentTime.getMinutes()) + ":" +
     Format2Len(CurrentTime.getSeconds());
   txtClock.value = timeStr;
  }
  setInterval("RefreshClock()", 1000);
 </script>
</head>
<body onload="RefreshClock()">
<!--页面加载的时候执行一次-->
 当前时间:<input type="text" id="txtClock" />
</body>
</html>

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

Javascript 相关文章推荐
jQuery select的操作实现代码
May 06 Javascript
js模仿html5 placeholder适应于不支持的浏览器
Jan 13 Javascript
js判断页面中是否有指定控件的简单实例
Mar 04 Javascript
一个JavaScript递归实现反转数组字符串的实例
Oct 14 Javascript
js脚本分页代码分享(7种样式)
Aug 19 Javascript
深入浅析Node.js 事件循环
Dec 20 Javascript
Bootstrap选项卡动态切换效果
Nov 28 Javascript
JS实现太极旋转思路分析
Dec 09 Javascript
一个可复用的vue分页组件
May 15 Javascript
使用store来优化React组件的方法
Oct 23 Javascript
微信小程序引入模块中wxml、wxss、js的方法示例
Aug 09 Javascript
JS实现骰子3D旋转效果
Oct 24 Javascript
javascript实现点击后变换按钮显示文字的方法
May 13 #Javascript
javascript实现十秒钟后注册按钮可点击的方法
May 13 #Javascript
javascript中clipboardData对象用法详解
May 13 #Javascript
javascript实现在网页任意处点左键弹出隐藏菜单的方法
May 13 #Javascript
浅谈jQuery中replace()方法
May 13 #Javascript
js实现仿Windows风格选项卡和按钮效果实例
May 13 #Javascript
JS实现模拟风力的雪花飘落效果
May 13 #Javascript
You might like
如何给phpcms v9增加类似于phpcms 2008中的关键词表
2013/07/01 PHP
php+jQuery+Ajax实现点赞效果的方法(附源码下载)
2020/07/21 PHP
innertext , insertadjacentelement , insertadjacenthtml , insertadjacenttext 等区别
2007/06/29 Javascript
JavaScript 学习笔记(十一)
2010/01/19 Javascript
javascript offsetX与layerX区别
2010/03/12 Javascript
用JavaScript对JSON进行模式匹配(Part 1-设计)
2010/07/17 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
2013/01/18 Javascript
详解JavaScript中void语句的使用
2015/06/04 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
JavaScript高级程序设计(第三版)学习笔记1~5章
2016/03/11 Javascript
Javascript中prototype的使用详解
2016/06/18 Javascript
JS简单生成随机数(随机密码)的方法
2017/05/11 Javascript
详解Nodejs mongoose
2018/06/10 NodeJs
Vue在页面数据渲染完成之后的调用方法
2018/09/11 Javascript
在vue项目中正确使用iconfont的方法
2018/09/28 Javascript
js中int和string数据类型互相转化实例
2019/01/16 Javascript
Vue CLI3移动端适配(px2rem或postcss-plugin-px2rem)
2020/04/27 Javascript
原生JavaScript实现贪吃蛇游戏
2020/11/04 Javascript
Python实现的文本简单可逆加密算法示例
2017/05/18 Python
matplotlib绘制动画代码示例
2018/01/02 Python
python 列表,数组和矩阵sum的用法及区别介绍
2018/06/28 Python
利用django-suit模板添加自定义的菜单、页面及设置访问权限
2018/07/13 Python
python opencv实现旋转矩形框裁减功能
2018/07/25 Python
Python 中@property的用法详解
2020/01/15 Python
python中的对数log函数表示及用法
2020/12/09 Python
详解Python中的GIL(全局解释器锁)详解及解决GIL的几种方案
2021/01/29 Python
英国在线定做百叶窗网站:Make My Blinds
2020/08/17 全球购物
国际贸易专业推荐信
2013/11/15 职场文书
求职信模板标准格式范文
2014/02/23 职场文书
体育活动总结范文
2014/05/04 职场文书
校园安全演讲稿
2014/05/09 职场文书
2014年护士个人工作总结
2014/11/11 职场文书
2014年计生工作总结
2014/11/21 职场文书
护士节慰问信
2015/02/15 职场文书
董事长开业致辞
2015/07/29 职场文书
领导干部学习三严三实心得体会
2016/01/05 职场文书