Presentation is loading. Please wait.

Presentation is loading. Please wait.

Java Script 中的時間物件. 課程內容 v 認識 date 的 Properties 及 method v 認識下拉式清單方塊( select )的 Properties 及 method.

Similar presentations


Presentation on theme: "Java Script 中的時間物件. 課程內容 v 認識 date 的 Properties 及 method v 認識下拉式清單方塊( select )的 Properties 及 method."— Presentation transcript:

1 Java Script 中的時間物件

2 課程內容 v 認識 date 的 Properties 及 method v 認識下拉式清單方塊( select )的 Properties 及 method

3 準備工作 v 檢查是否已有 c:\temp\ 自己的學號 \js-9  若有,請清除裡面所有的檔案  若否,建立新目錄 c:\temp\ 自己的學號 \js-9

4 下載 JavaScript 的 date 範例 v 請使用 IE 連結至 http://www.cc.nctu.edu.tw/~twli/ http://www.cc.nctu.edu.tw/~twli/ v 請至「 JavaScript 教學」「下載「 時間物件」的教材 」下載「 時間物件」的教材 v 下載「 date.htm 」將此檔案存至 「 c:\temp\ 自己的學號 \js-9 」中 date.htm v 使用 FrontPage 開啟 ‘test1.htm’ 的網 頁,並移至「一般」模式如右下 圖

5 Date 物件的方法法 v var now = new Date();  宣告 now 這變數存入網頁一開始的時間狀態(當時 date 的物件) v var day = now.getDay();  取得 now 中的星期,由 0 (星期天)至 6 (星期六) v var month = now.getMonth();  取得 now 中的月份,由 0 ( 1 月)至 11 ( 12 月) v var year = now.getFullYear();  取得 now 中的西元年份,由 4 位數表示 v var date = now.getDate();  取得 now 中的日期,由 1 ( 1 日)至 31 ( 31 日) v var hour = now.getHours();  取得 now 中的時數,由 0 到 23 v var min = now.getMinutes();  取得 now 中的分數,由 0 至 59 v var sec = now.getSeconds();  取得 now 中的秒數,由 0 至 59

6 列印現在的日期與時間 v 今天的日期為:   var mm = month+1;  document.write(year+" 年 "+mm+" 月 "+date+" 日 ");  v 今天的星期為:   document.write(dayNames[day]);  v 現在的時間為:   document.write(hour+" 點 "+min+" 分 "+sec+" 秒 "); 

7 認識 date 物件本身的格式 v var now = new Date();  當下的時間 v var now = new Date(“December 25, 2004”); v var now = new Date(“Dec 25, 2004”);  2004 年 12 月 25 日 v var now = new Date(“Dec 25, 2004, 6:25:22”);  2004 年 12 月 25 日 6 點 25 分 22 秒

8 時間相減及習作一 v var ny=new Date(“Jan, 7, 2005"); v var gap = ny.getTime() - now.getTime();  getTime 方法是指從 1970 年 1 月 1 日 0 點 0 時 0 分開始算起的總毫秒數( 10 -3 sec ) v gap = Math.floor(gap / (1000 * 60 * 60 * 24));  此式用來算現在距離 2005 年 1 月 7 日還有幾天 v 習作一:  2005 年的農曆新年為 2005 年 2 月 9 日,請完成「今天距離 2005 年的農曆 新年還有」敘述。

9 習作二:查星期 v 利用函式將下拉式清單方塊,所選的 value ,一一的 串連以文字的形式起來成為一個標準 day 的格式,如 “Dec 25, 2004” v 使用一變數 x 存入上面的日期,如 x= “Dec 25, 2004” v 宣告新變數 qday ,如 var qday = new Date(x); v 然後取出 qday 中的星期,利用此數取出 dayNames 陣 列所相對應的「星期」文字。最將此文字置於 F1.T1.value

10 習作三:計算在此網頁待的時間 v 當你按下「計算出你在此網頁待的時間」,去呼叫 一函式 v 此函式將宣告另一變數存入當時的 date 物件  如 var newest = new Date()  注意: new 代表的是網頁剛開啟的時間,而 newest 代表的是按下「 計算出你在此網頁待的時間」瞬間的時間。 v 利用時間的相減將 new 與 newest 至間的秒數與分數算 出,並在 F1.T2.value 印出所待的時間

11 JS Homework 9 v 請於 12 月 31 日午夜前 email 通知助教 u aquaion22@edirect168.com aquaion22@edirect168.com  學號、姓名及你個人網頁的網址。 (10%)  將今天的上課所做表單網頁完成並完成所有的作業,將「 js-9 」整個 目錄上傳至 WWW ,並在目錄框架中為其增加新的超連結 (10%) v HW1 : (20%)  今天距離 2005 年的農曆新年還有 v HW2 : (30%)  查星期 v HW3 : (30%)  計算在此網頁待的時間


Download ppt "Java Script 中的時間物件. 課程內容 v 認識 date 的 Properties 及 method v 認識下拉式清單方塊( select )的 Properties 及 method."

Similar presentations


Ads by Google