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>
