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{width: 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>