zoukankan      html  css  js  c++  java
  • 2016-06-02 获取系统当前日期和时间并显示在某个元素上

    1.

    <script>
            window.onload=function(){
             getDateAndTime();
            setInterval(getDateAndTime,1000);
         }
    
            //获取系统的日期和时间并显示在某个元素上
            function getDateAndTime(){
                var myDate = new Date();
                var year = myDate.getFullYear();
                var month = myDate.getMonth()+1;
                var day = myDate.getDate();
                var week = myDate.getDay();//星期几
                formateWeekDay(week);//格式化星期几
                var hour = myDate.getHours();
                var minute = myDate.getMinutes();
                var second = myDate.getSeconds();
                var str = formateNum(year)+'年'+formateNum(month)+'月'+formateNum(day)+'日'+formateNum(hour)+'时'+formateNum(minute)+'分'+formateNum(second)+'秒';
                //document.body.innerHTML=str;
                var showTime =document.getElementById("p");
                showTime.innerHTML=str;
            }
    
            //格式化星期几
            function formateWeekDay(num){
                if(num===0) return '星期日';
                if(num===1) return '星期一';
                if(num===2) return '星期二';
                if(num===3) return '星期三';
                if(num===4) return '星期四';
                if(num===5) return '星期五';
                if(num===6) return '星期六';
            }
    
            //格式化一位数字前面加个0
            function  formateNum(num){
                return num<10?'0'+num:num;
            }
        </script>
    </head>
    <body>
        <p id="p">当前时间为:</p>
    </body>
    

    2.

     <style>
            img{ 100px; height: 100px}
        </style>
        <script>
            window.onload=function(){
             getDateAndTime();
            setInterval(getDateAndTime,1000);
         }
    
            //获取系统的日期和时间并显示在某个元素上
            function getDateAndTime(){
                var myDate = new Date();
                var p = document.getElementById('p');
                var hour = myDate.getHours();
                var minute = myDate.getMinutes();
                var second = myDate.getSeconds();
                var str = formateNum(hour)+":"+formateNum(minute)+":"+formateNum(second);
    
                p.innerHTML ='当前时间为 '+str;
                var imgs =document.getElementsByTagName('img');
                for(var i =0;i<imgs.length;i++){
    
                    (i==2||i==5)?imgs[i].src='images/colon.JPG': imgs[i].src='images/'+str.charAt(i)+'.JPG';
                }
            }
    
            //格式化一位数字前面加个0
            function  formateNum(num){
                return num<10?'0'+num:''+num;
            }
        </script>
    </head>
    <body>
        <p id="p"></p>
        <img src="images/0.JPG"/>
        <img src="images/0.JPG"/>
        <img class="colon" src="images/colon.JPG"/>
        <img src="images/0.JPG"/>
        <img src="images/0.JPG"/>
        <img class="colon"  src="images/colon.JPG"/>
        <img src="images/0.JPG"/>
        <img src="images/0.JPG"/>
    </body>
    

      

  • 相关阅读:
    .net Core使用EFCore连接数据库
    前端实践项目(二)webpack生成html和外部引用
    前端实践项目(一)使用webpack进行打包编译
    消息队列的模式
    消息队列的应用场景
    .Net EasyNetQ的使用
    .Net中简单地使用RabbitMQ消息队列
    C# 虚函数virtual的使用之二
    C#之System.Object
    .Net EntityFramework(EF) CodeFirst模式
  • 原文地址:https://www.cnblogs.com/bravolove/p/5554567.html
Copyright © 2011-2022 走看看