zoukankan      html  css  js  c++  java
  • 精通javascript笔记(智能社)——数字时钟

    JS代码:


     <script type="text/javascript">
        window.onload=function(){

       //小于10的数字补零及数字转字符串
            function toDouble(num){
                if(num>=0&&num<10){
                    num='0'+num;
                }else{
                    num=''+num;
                }
                return num;
            }


            var oDiv1=document.getElementById("div1");
            var aImgs=oDiv1.getElementsByTagName('img');


            function times(){
            var oDate=new Date();
            var nowtime=toDouble(oDate.getHours())+toDouble(oDate.getMinutes())+toDouble(oDate.getSeconds());
                for(var i=0; i<aImgs.length;i++){
                    aImgs[i].src='images/'+nowtime.charAt(i)+'.png';  //charAt()用于取字符串nowtime的第i位元素
                }        
            }


            setInterval(times,1000)
            times(); //加载时自动执行一次
        }
    </script>

    html代码:


     注:需要自己建立0.png,1.png,2.png ...9.png共十张png图片,内容分别为0,1,2 ... 9。

    <div id="div1">
            <ul>
                <li><img src="images/0.png" /></li>
                <li><img src="images/1.png" /></li>
                <li><h1>:</h1></li>
                <li><img src="images/2.png" /></li>
                <li><img src="images/3.png" /></li>
                <li><h1>:</h1></li>
                <li><img src="images/4.png" /></li>
                <li><img src="images/5.png" /></li>
            </ul>
        </div>

  • 相关阅读:
    Dubbo入门微服务框架学习
    CSS学习笔记:溢出文本省略(text-overflow)
    ThreadLocal
    redis事务及乐观锁
    redis的三个特殊数据结构(geospatial、bitmaps、hyperloglogs)
    js日期时间格式化
    SimpleDateFormat 中的yyyy-MM-dd HH:mm:ss.SSS说明
    js中window.location.search的用法和作用。
    MySQL查询表中某个字段的重复数据
    完全卸载Oracle方法(超详细)
  • 原文地址:https://www.cnblogs.com/lvmylife/p/4385943.html
Copyright © 2011-2022 走看看