<title>无标题文档</title>

<script>

function toDou(n){

    if(n<10){

        return '0'+n;

        }else{

            return ''+n;  //保证返回的都是字符串，避免放在一起成了相加

            }

    }

window.onload=function (){

    var aImg=document.getElementsByTagName('img');

    function tick(){

         var oDate=new Date();

    var str=toDou(oDate.getHours())+toDou(oDate.getMinutes())+toDou(oDate.getSeconds());

    for(var i=0;i<aImg.length;i++){

        aImg[i].src='images/'+str.charAt(i)+'.gif';

        }

        }

    setInterval(tick,1000);

    tick();

    };

</script>

</head>

<body style="background:#999; color:white;">

<img src="data:images/0.gif">

<img src="data:images/0.gif">

:

<img src="data:images/0.gif">

<img src="data:images/0.gif">

:

<img src="data:images/0.gif">

<img src="data:images/0.gif">

</body>

小问题：
var str='abcdef';
alert(str[0]); 在IE7下显示undefined
用str.charAt(0)可以解决这个兼容性问题

数码时钟
获取系统时间
Date对象
getHours、getMinutes、getSeconds
Date对象其他方法
年 getFullYear()
月 getMonth() 从0开始
日 getDate()
星期 getDay() 0,1,2,3,4,5,6 0代表周末

JS定时器的使用--数码时钟的更多相关文章

  1. 通过JS制作一个简易数码时钟

    设计思路: 数码时钟即通过图片数字来显示当前时间,需要显示的图片的URL根据时间变化而变化. a.获取当前时间Date()并将当前时间信息转换为一个6位的字符串; b.根据时间字符串每个位置对应的数字 ...

  2. js基础练习三之数码时钟

    这章节有两个实例,1,定时器的使用; 2,数码时钟; 用到的js知识:定时器,Date对象. >>>>>定时器 开启定时器: setInterval 间隔型 setTim ...

  3. js之数码时钟加随机变色

      HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  4. js定时器的使用(实例讲解)

    在javascritp中,有两个关于定时器的专用函数,分别为: 1.倒计定时器:timename=setTimeout("function();",delaytime);2.循环定 ...

  5. 移动Web与js定时器暂停或不准确计时的问题解决

    PC 上的 Firefox.Chrome 和 Safari 等浏览器,都会自动把未激活页面中的 JavaScript 定时器(setTimeout.setInterval)间隔最小值改为 1 秒以上: ...

  6. js定时器 特定时间执行某段程序的例子

    定时器想必大家并不陌生吧,在本文为大家详细介绍下js中是如何实现定时器的,具体原理及代码如下. 例子: $(function(){ var handler = function(){ //www.jb ...

  7. js定时器setInterval()与setTimeout()

    js定时器setInterval()与setTimeout() 1.setTimeout(Expression,DelayTime),在DelayTime过后,将执行一次Expression,setT ...

  8. C#-WebForm JS定时器

    JS定时器: 1.window.setTimeout(function(){},3000) 延迟3秒执行 2.window.setInterval(function(){},3000) 也叫重复器,每 ...

  9. Vue清除所有JS定时器

    Vue清除所有JS定时器 在webpack + vue 的项目中如何在页面跳转的时候清除所有的定时器 JS定时器会有一个返回值(数字),通过这个返回值我们可以找到这个定时器 在vue项目中可以使用路由 ...

随机推荐

  1. C#正则分组实例

    static void Main(string[] args) { string str = "大家家家家家家家明天天天天天天天天玩得得得得得得得开心"; Regex reg = ...

  2. 给当前的URL添加/更新新的参数

    /** * 给当前的URL添加/更新新的参数 * @param a 参数 * @param b 值 * @returns {string} 新的参数 * @constructor */ functio ...

  3. Just do it!!!

    从今日起,开个开发自己个人轻量级博客,加油!!!!!

  4. orderby与groupby区别

    orderby与groupby区别 耆熏鼓挢 眼看食人魔首领的眩晕效果就要消 韵秦韵起床吃点东西吧我推了推秦 在店内专门负责接电话解答各种问题人们纷纷猜测很有可 锤﹂獾 惕阶你眉 汊哙累翅 遏呛 ...

  5. iOS 打包上传AppStore相关(1)-相关证书配置

    最近一个老项目需要更新迭代,一个新的项目需要上线.有一些自己出现的BUG,也有一些没搞懂到处翻资料的问题.在此想做一个总结,写一下总体步骤,尽可能的详细一些,以及自己的一些理解.有很多步骤因为我们查阅 ...

  6. apicloud教程3 （转载）

    本帖最后由 中山赢友网络科技有限公司 于 2015-10-26 16:44 编辑 继<APICloud之小白图解教程系列(一):认识APICloud><APICloud之小白图解教程 ...

  7. form表单验证提示语句

    <input id="idcardcode" name="idcardcode" class="form-control"       ...

  8. jQuery（1）——了解jQuery

    jQuery 终于开始了jQuery的学习了,好开心,虽然感觉JavaScript并没有学好,尴尬.木事,咋们慢慢来.fighting [jQuery简介] jQuery是继Prototype之后又一 ...

  9. caogao

    https://css-tricks.com/ 在safari浏览器中添加transform规则,如果没有效果,把该规则的原始元素以块状显示 http://webdesignerwall.com/tr ...

  10. django搭建Bootstrap常用问题解决方法

    1.进入页面,提示Creating a ModelForm without either the 'fields' attribute or the 'exclude'时 解决方法:打开forms.p ...