~~~
<script>
alert(new Date());//當前系統的時間對象
</script>
~~~
***
課堂練習-1：頁面顯示時間
~~~
<script type="text/javascript">
window.onload = function() {
var oBody = document.body;
setInterval(fnTime, 1000);
fnTime();
function fnTime() {
var myTime = new Date();
// myTime是object類型 下面是num類型
var iYear = myTime.getFullYear();
var iMonth = myTime.getMonth() + 1;
var iDate = myTime.getDate();
var iWeek = myTime.getDay();
var iHours = myTime.getHours();
var iMin = myTime.getMinutes();
var iSec = myTime.getSeconds();
var str = '';
if(iWeek === 0) iWeek = '星期日';
if(iWeek === 1) iWeek = '星期一';
if(iWeek === 2) iWeek = '星期二';
if(iWeek === 3) iWeek = '星期三';
if(iWeek === 4) iWeek = '星期四';
if(iWeek === 5) iWeek = '星期五';
if(iWeek === 6) iWeek = '星期六';
str = iYear + '年' + iMonth + '月' + iDate + '日 ' + iWeek + ' ' + toTwo(iHours) + ':' + toTwo(iMin) + ':' + toTwo(iSec);
oBody.innerHTML = str;
}
function toTwo(n) {
return n < 10 ? '0' + n : '' + n;
}
}
</script>
~~~
課堂練習-2：圖片時間
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function () {
var oBody = document.body;
var oP = document.getElementById('time');
var aImg = document.getElementsByTagName('img');
setInterval(fnTime,1000);
fnTime();
function fnTime() {
var myTime = new Date();
// myTime是object類型 下面是num類型
var iHours = myTime.getHours();
var iMin = myTime.getMinutes();
var iSec = myTime.getSeconds();
var str = toTwo(iHours)+':'+toTwo(iMin)+':'+toTwo(iSec);
oP.innerHTML = str;
for(var i = 0;i < aImg.length;i++){
if(i == 2 || i == 5){
aImg[i].src='img/colon.JPG'
}else{
aImg[i].src='img/'+str.charAt(i)+'.JPG'
}
}
}
function toTwo(n) {
return n < 10 ? '0'+n:''+n;
}
}
</script>
</head>
<body>
<p id="time" style="font-size: 50px;"></p>
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
<img src="img/0.JPG">
</body>
</html>
~~~
課堂練習-3：倒計時
~~~
<script type="text/javascript">
window.onload = function () {
// 現在的時間點（變化的）
// 未來的時間點（不變的）
var iNow = new Date();
var iNew = new Date(2018,8,18,19,54,0);//月份從0開始
//不除1000是毫秒數,Math.floor向下取整，去掉小數點
var t = Math.floor((iNew - iNow)/1000);
var str = Math.floor(t/86400)+'天'+Math.floor(t%86400/3600)+'時'+Math.floor(t%86400%3600/60)+'分'+Math.floor(t%60)+'秒';
/*
* 天：Math.floor(t/86400)
* 時：Math.floor(t%86400/3600)
* 分：Math.floor(t%86400%3600/60)
* 秒：Math.floor(t%60)
*
* 數值：new Date(2017,8,18,19,54,0)
* 字符串：new Date('November 10,2017 22:3:0')
*/
alert(str);
}
</script>
~~~
課堂練習-4：倒計時（要求到0時不變成負數）
***
### 時間戳getTime()
~~~
<script>
alert(new Date().getTime());//得到1970年1月1日到目前為止經過多少毫秒
</script>
~~~
***
拓展練習：
***
[圖片素材下載](https://pan.baidu.com/s/11Luvx0SiX71Zk01lpSUS_g)
