Java Script -3 課程大綱 n 第三週 n

Зарегистрируйтесь, чтобы просмотреть полный документ!

РЕГИСТРАЦИЯ

Java Script -3

課程大綱 n 第三週 n n 寫在外部檔案區的 JS DOM (Document Object Model) n n Window Document Form Cookie n n n 建立有效期刪除

寫在外部檔案區的JS n In HTML n n n <script src=“Change. Pic. js"></script> a=AAA(); Change. Pic. js n n n <!-function AAA() { return p; } //-->

DOM (Document Object Model) n n Document Object Model (文件物件模型 ) 瀏覽器載入網頁時，就會根據網頁的內容來建立相關的文件物件模型 DOM是階層式的物件模型，有網頁的各種物件的性質和方法. 用以產生動態網頁 Dynamical HTML.

DOM (Document Object Model) 資料來源 : Jyh-Shing Roger Jang

DOM使用法 n 物件都有其相對應的Method(方法)與 Property(屬性) n object. Name. property. Name n object. Name["property. Name"]

DOM使用法-Window. status. n n n <srcipt language=“javascript”> window. status=“歡迎光臨LEo小站"; </script> <srcipt language=“javascript”> window[“status”]=“歡迎光臨LEo小站 "; </script>

Document(文件 )的 property(屬性 ) n n n n n document. location 網址 document. URL網址 document. last. Modified 最後修改時間 document. file. Modified. Date 最後修改時間 document. file. Updated. Date 檔案修改日期 document. file. Created. Date 檔案產生日期 document. file. Size 檔案大小 document. bg. Color 網頁背景顏色 document. fg. Color 網頁前景顏色 document. link. Color 文字連結顏色 document. alink. Color 點選中的文字連結顏色 document. vlink. Color 點選後的文字連結顏色 document. default. Charset 預設的字元集 document. cookie字串值 document. referer 從哪連結而來 document. protocol 傳輸通訊協定 document. security 安全憑證資訊

列出所有的Property(無method) n function show. All. Prop(obj, obj. Name) { for (var i in obj) document. writeln(obj. Name+". "+i+"="+obj[i]); } n show. All. Prop(document, “document") n n

Method(方法 )之用法 n <a href="javascript: history. go(-1)">前一頁</a> <a href="javascript: history. go(0)">重新整理</a> <a href="javascript: history. go(+1)">下一頁</a> n <a href="javascript: window. print()">列印網頁</a> n n <input type=“button” on. Click=“javascript: window. move. By(0, 10)” value=“往下跑"> document. body. background =“image URL”; (換背景圖)

Method(方法 )之用法 n n n n window. open([url], [Name], [Control. String], [keep. History]); url：新視窗之網址 Name：新視窗名稱 Control. String：設定新視窗的寬度、高度、位置、是否顯示狀態列, 具列等功能 keep. History：是否保留 History 資料 EX: window. open('http: //www. nthu. edu. tw', ‘NTHU', 'status=no, toolb ar=no, width=800, height=600');

Try Look! n 請寫一個可換背景圖的程式

Cookie n n Java. Script 不能對使用端的硬碟做任何存取的動作. 除了餅乾（Cookie）可以存小部分有限的資料。 (Cookie是否啟動) navigator. cookie. Enabled

Cookie建立 n document. cookie=“name=value; expires=exp Date”; n n name=value (cookie名稱與值) expires=exp. Date (cookie有效日期) n EX: document. cookie=“Visit. Time=5"; n 秀出所有的Cookie n n alert(document. cookie);

Cookie值之取出 n n n n n function get. Cookie(name) { var arg = name + "="; var name. Len = arg. length; var cookie. Len = document. cookie. length; var i = 0; while (i < cookie. Len) { var j = i + name. Len; if (document. cookie. substring(i, j) == arg) { var end. Index = document. cookie. index. Of("; ", j); if (end. Index == -1) end. Index = document. cookie. length; return document. cookie. substring(j, end. Index); } i = document. cookie. index. Of(" ", i) + 1; if (i == 0) break; } return null; }

Cookie有效期 n n n duration = 365; //保留天數 today = new Date(); expire. Date = new Date(); //有效期 n expire. Date. set. Time(today. get. Time()+1000*60*60*24*duration) ; n document. cookie=“visit=5; expires="+expire. Date. to. GMTString();

Cookie刪除 n ? n 把有效期設為昨天即可.

Try Look! n 請寫一個紀錄使用者來幾次的JS

作業 n n n 請用JS寫一個電子時鐘(表) (盡量酷一點) 看看你可以加入什麼功能或者你可以用目前學的東西寫一個JS小遊戲嗎?

Скачать презентацию Java Script -3 課程大綱 n 第三週 n

c6d95bed1cfd82c464f1bb5b6dd3df32.ppt

Количество слайдов: 19