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 相关文章推荐
日历查询的算法 如何计算某一天是星期几
Dec 12 Javascript
javascript jq 弹出层实例
Aug 25 Javascript
jquery实现的图片点击滚动效果
Apr 29 Javascript
javascript截取字符串小结
Apr 28 Javascript
jQuery实现径向动画菜单效果
Jul 17 Javascript
关于微信上网页图片点击全屏放大效果
Dec 19 Javascript
Vue 兄弟组件通信的方法(不使用Vuex)
Oct 26 Javascript
ES6中javascript实现函数绑定及类的事件绑定功能详解
Nov 08 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
jquery插件开发模式实例详解
Jul 20 jQuery
vue基于better-scroll仿京东分类列表
Jun 30 Javascript
node.js如何操作MySQL数据库
Oct 29 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
神族 PROTOSS 概述
2020/03/14 星际争霸
使用PHP维护文件系统
2006/10/09 PHP
PHP mail()函数使用及配置方法
2014/01/14 PHP
php命令行用法入门实例教程
2014/10/27 PHP
php简单socket服务器客户端代码实例
2015/05/18 PHP
thinkPHP5.0框架安装教程
2017/03/25 PHP
JS实现下拉框的动态添加(附效果)
2013/04/03 Javascript
js中浮点型运算BUG的解决方法说明
2014/01/06 Javascript
jquery选择器大全 全面详解jquery选择器
2014/03/06 Javascript
Javascript学习笔记之数组的构造函数
2014/11/23 Javascript
jquery及js实现动态加载js文件的方法
2016/01/21 Javascript
简单讲解jQuery中的子元素过滤选择器
2016/04/18 Javascript
Vue axios 中提交表单数据(含上传文件)
2017/07/06 Javascript
webpack实现热更新(实施同步刷新)
2017/07/28 Javascript
vue实现从外部修改组件内部的变量的值
2020/07/30 Javascript
jquery插件实现轮播图效果
2020/10/19 jQuery
[01:18:33]Secret vs VGJ.S Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
从零学python系列之新版本导入httplib模块报ImportError解决方案
2014/05/23 Python
python脚本实现查找webshell的方法
2014/07/31 Python
Python的collections模块中namedtuple结构使用示例
2016/07/07 Python
Python使用PIL模块生成随机验证码
2017/11/21 Python
Django 路由控制的实现代码
2018/11/08 Python
Python装饰器实现方法及应用场景详解
2020/03/26 Python
手把手教你用Django执行原生SQL的方法
2021/02/18 Python
意大利香水和彩妆护肤品购物网站:Ditano
2017/08/13 全球购物
广告设计专业自荐信范文
2013/11/14 职场文书
项目经理的岗位职责
2013/11/23 职场文书
社区庆中秋节活动方案
2014/02/07 职场文书
建议书怎么写
2014/03/12 职场文书
工程建设实施方案
2014/03/14 职场文书
党的群众路线教育实践活动公开承诺书
2014/03/28 职场文书
劳动竞赛口号
2014/06/16 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
同学聚会祝酒词
2015/08/10 职场文书
团干部培训班心得体会
2016/01/06 职场文书
Moment的feature导致线上bug解决分析
2022/09/23 Javascript