博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何用js显示时钟?
阅读量:6989 次
发布时间:2019-06-27

本文共 947 字,大约阅读时间需要 3 分钟。

 这一段对js有点兴趣,做了几个js的小实验,感觉挺有意思的,其中一个就是控制时钟的显示,有兴趣的可以研究啊!下面先看下部分代码:

 

首先在js代码中声明两个变量:timerIDtimerRunning,大家可以看到在showTimes方法中给timerId赋值:timerID = setTimeout("showTimes()", 1000);表示浏览器接收到setTimeout指令的1000毫秒之后就执行showTimes方法,如果想取消超时设定,则调用stopClock(),在该方法中有个clearTimeout(timerID);可以取消超时设定,若超时设定还没有发生,他就被取消了,showTimes方法是不会被调用的,setTimeout()方法很有意思啊,有兴趣的可以研究,可以对比下setInterval("showTime()",1000);看看两个方法的执行效果;顾名思义,timerRunning就是表示时间是否在显示,主要是为stopClock()showTimes()做服务的。

另外就是如何让得到的时间显示,我们可以看到在js中的showTimes方法中有个document.clock.face.value = timerVal;document包含整个html文档,在html中可以看到form表单的name属性为clock,在表单的input元素中有type=”text”的文本,其name属性为face,这样就可以找到html页面中的文本,把它的value值置为我们得到的时间,这样就会在页面上对应的文本框中显示时间,时间的获得可以先声明一个时间对象var now = new Date();这样再调用它的getYear()getMonth()等来获得时间。设置好后在html加载时调用这个方法即可,也就是<body onLoad="startClock()">这样在html页面加载时就会自动调用startClock方法,从而让时间显示在页面文本中。

Js很有意思啊,呵呵,有兴趣的可以共同研究!

本文转自HDDevTeam 51CTO博客,原文链接:http://blog.51cto.com/hddev/652562,如需转载请自行联系原作者

你可能感兴趣的文章
详解如何使git将项目上传到github
查看>>
sql多表连接,分组例子
查看>>
Rainbond v5.1.2发布,微服务架构应用便捷管理和交付
查看>>
新浪博客地址
查看>>
JAVA折腾微信公众平台(Token验证)
查看>>
疯狂Spring Cloud连载(28)开发消息微服务
查看>>
提高HTML5 canvas性能的几种方法!
查看>>
golang教程
查看>>
Redis 存储字符串和对象
查看>>
android样式开发遇到的小坑
查看>>
感知器算法
查看>>
课堂笔记-linux服务器架设
查看>>
解决OracleDBConsoleorcl不能启动
查看>>
如何设置exchange连接器传递限制
查看>>
域名转换IP
查看>>
linux系统学习之Linux系统日志及日志分析
查看>>
Python进阶07 lambda函数
查看>>
struts2 使用注解 导出excel
查看>>
Java Calendar
查看>>
iPad 分屏多任务: Slide Over & Split View
查看>>