利用JS函数制作时钟运行程序
2016-01-07 19:08
671 查看
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>时钟</title> <script type="text/javascript"> function toDouble(num)//不满两位,空位补零 { if(num<10) { return '0'+num;//一位数前面加零,就变为两位数 } else { return ''+num; } } window.onload=function()//程序主体运行内容 { var oBtn=document.getElementById('btn1'); var aImg=document.getElementsByTagName('img'); var i=0; function updateTime() { var oDate=new Date();//获取系统时间 var str=toDouble(oDate.getHours())+toDouble(oDate.getMinutes())+toDouble(oDate.getSeconds()); //alert(str); for(i=0;i<aImg.length;i++) { aImg[i].src='img/'+str.charAt(i)+'.png';//设置图片路径使用charAt方法 } } setInterval(updateTime,1000);//自动跟随系统时间每秒刷新 updateTime();//避免页面刷新时停留1秒钟等待时间 }; </script> </head> <body style="color:#FFFF00; background:#990099; font-size:30px;"> <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> 点 <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> 分 <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/> 秒 </body> </html>
运行结果如下图:
相关文章推荐
- JavaScript规范
- JSPatch中的OC高级语法
- js事件绑定及冒泡、捕获和默认行为处理
- 利用 Fragment ,JSON,第三方开源框架实现 仿新闻界面
- jstl中处理日期格式,小数,数字,百分比 fmt
- ExtJs combobox 下拉图标
- jstl fn:replace替换换行符
- JSP类似购物车根据后台数据自动生成一行商品,点击按钮实现数量价格自动增加
- js urlencode , encodeURIComponent
- javascript 正则匹配 提取所有 preg_match_all matchAll方法
- js 判断页面加载状态
- Jsoncpp的使用
- js问的我醉的不要不要的。
- JavaScript Backdoor - 三好学生
- 清除QQ账号所有授权应用 JavaScript代码
- 周记(jsp自定义标签)
- JS date常用代码积累
- javascript中select下拉框的用法总结
- Javascript模块式编程小结
- js中判断对象是否为空的方法