JavaScript經(jīng)典教程.ppt

《JavaScript經(jīng)典教程.ppt》由會(huì)員分享，可在線閱讀，更多相關(guān)《JavaScript經(jīng)典教程.ppt（98頁珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。

JavaScript教程 JavaScript是由Netscape公司開發(fā)并隨Navigator導(dǎo)航者一起發(fā)布的 介于Java與HTML之間 基于對(duì)象事件驅(qū)動(dòng)的編程語言 正日益受到全球的關(guān)注 因它的開發(fā)環(huán)境簡(jiǎn)單 不需要Java編譯器 而是直接運(yùn)行在Web瀏覽器中 而因倍受Web設(shè)計(jì)者的所愛 JavaScript教程語言概況 JavaScript的出現(xiàn) 它可以使得信息和用戶之間不僅只是一種顯示和瀏覽的關(guān)系 而是實(shí)現(xiàn)了一種實(shí)時(shí)的 動(dòng)態(tài)的 可交式的表達(dá)能力 JavaScript腳本正是滿足這種需求而產(chǎn)生的語言 它深受廣泛用戶的喜愛的歡迎 它是眾多腳本語言中較為優(yōu)秀的一種 它與WWW的結(jié)合有效地實(shí)現(xiàn)了網(wǎng)絡(luò)計(jì)算和網(wǎng)絡(luò)計(jì)算機(jī)的藍(lán)圖 無凝Java家族將占領(lǐng)Internet網(wǎng)絡(luò)的主導(dǎo)地位 JavaScript幾個(gè)基本特點(diǎn) 腳本編寫語言基于對(duì)象的語言簡(jiǎn)單性安全性動(dòng)態(tài)性跨平臺(tái)性 JavaScript和Java的區(qū)別 雖然JavaScript與Java有緊密的聯(lián)系 但卻是兩個(gè)公司開發(fā)的不同的兩個(gè)產(chǎn)品 Java是SUN公司推出的新一代面向?qū)ο蟮某绦蛟O(shè)計(jì)語言 特別適合于Internet應(yīng)用程序開發(fā) JavaScript是Netscape公司的產(chǎn)品 其目的是為了擴(kuò)展NetscapeNavigator功能 而開發(fā)的一種可以嵌入Web頁面中的基于對(duì)象和事件驅(qū)動(dòng)的解釋性語言 它的前身是LiveScript Java的前身是Oak語言 基于對(duì)象和面向?qū)ο?Java是一種真正的面向?qū)ο蟮恼Z言 即使是開發(fā)簡(jiǎn)單的程序 必須設(shè)計(jì)對(duì)象 JavaScript是種腳本語言 它可以用來制作與網(wǎng)絡(luò)無關(guān)的 與用戶交互作用的復(fù)雜軟件 它是一種基于對(duì)象 ObjectBased 和事件驅(qū)動(dòng) EventDriver 的編程語言 因而它本身提供了非常豐富的內(nèi)部對(duì)象供設(shè)計(jì)人員使用 解釋和編譯 兩種語言在其瀏覽器中所執(zhí)行的方式不一樣 Java的源代碼在傳遞到客戶端執(zhí)行之前 必須經(jīng)過編譯 因而客戶端上必須具有相應(yīng)平臺(tái)上的仿真器或解釋器 它可以通過編譯器或解釋器實(shí)現(xiàn)獨(dú)立于某個(gè)特定的平臺(tái)編譯代碼的束縛 JavaScript是一種解釋性編程語言 其源代碼在發(fā)往客戶端執(zhí)行之前不需經(jīng)過編譯 而是將文本格式的字符代碼發(fā)送給客戶編由瀏覽器解釋執(zhí)行 強(qiáng)變量和弱變量 兩種語言所采取的變量是不一樣的 Java采用強(qiáng)類型變量檢查 即所有變量在編譯之前必須作聲明 如 Integerx Stringy x 1234 x 4321 其中X 1234說明是一個(gè)整數(shù) Y 4321說明是一個(gè)字符串 JavaScript中變量聲明 采用其弱類型 即變量在使用前不需作聲明 而是解釋器在運(yùn)行時(shí)檢查其數(shù)據(jù)類型 如 x 1234 y 4321 前者說明x為其數(shù)值型變量 而后者說明y為字符型變量 代碼格式不一樣 Java是一種與HTML無關(guān)的格式 必須通過像HTML中引用外媒體那么進(jìn)行裝載 其代碼以字節(jié)代碼的形式保存在獨(dú)立的文檔中 JavaScript的代碼是一種文本字符格式 可以直接嵌入HTML文檔中 并且可動(dòng)態(tài)裝載 編寫HTML文檔就像編輯文本文件一樣方便 嵌入方式不一樣 在HTML文檔中 兩種編程語言的標(biāo)識(shí)不同 JavaScript使用 來標(biāo)識(shí)Java使用 來標(biāo)識(shí) 靜態(tài)聯(lián)編和動(dòng)態(tài)聯(lián)編 Java采用靜態(tài)聯(lián)編 即Java的對(duì)象引用必須在編譯時(shí)的進(jìn)行 以使編譯器能夠?qū)崿F(xiàn)強(qiáng)類型檢查 JavaScript采用動(dòng)態(tài)聯(lián)編 即JavaScript的對(duì)象引用在運(yùn)行時(shí)進(jìn)行檢查 如不經(jīng)編譯則就無法實(shí)現(xiàn)對(duì)象引用的檢查 編寫第一個(gè)JavaScript程序 JavaScriptAppearshere alert 這是第一個(gè)JavaScript例子 alert 歡迎你進(jìn)入JavaScript世界 alert 今后我們將共同學(xué)習(xí)JavaScript知識(shí) 編寫第一個(gè)JavaScript程序 JavaScript代碼由 說明 在標(biāo)識(shí) 之間就可加入JavaScript腳本 alert 是JavaScript的窗口對(duì)象方法 其功能是彈出一個(gè)具有OK對(duì)話框并顯示 中的字符串 通過標(biāo)識(shí)說明 若不認(rèn)識(shí)JavaScript代碼的瀏覽器 則所有在其中的標(biāo)識(shí)均被忽略 若認(rèn)識(shí) 則執(zhí)行其結(jié)果 使用注釋這是一個(gè)好的編程習(xí)慣 它使其他人可以讀懂你的語言 JavaScript以標(biāo)簽結(jié)束 JavaScript基本數(shù)據(jù)結(jié)構(gòu) JavaScript提供腳本語言的編程與C 非常相似 它只是去掉了 語言中有關(guān)指針等容易產(chǎn)生的錯(cuò)誤 并提供了功能強(qiáng)大的類庫 對(duì)于已經(jīng)具備 或 語言的人來說 學(xué)習(xí)JavaScript腳本語言是一件非常輕松愉快的事 JavaScript代碼的加入 可以直接將JavaScript腳本加入文檔JavaScript語言代碼 JavaScript語言代碼 說明 通過標(biāo)識(shí) 指明JavaScript腳本源代碼將放入其間 通過屬性Language JavaScript 說明標(biāo)識(shí)中是使用的何種語言 這里是JavaScript語言 表示在JavaScript中使用的語言 基本數(shù)據(jù)類型 基本數(shù)據(jù)類型常量變量 基本數(shù)據(jù)類型 在JavaScript中四種基本的數(shù)據(jù)類型 數(shù)值 整數(shù)和實(shí)數(shù) 字符串型 用 號(hào)或 括起來的字符或數(shù)值 布爾型 使True或False表示 和空值 常量 整型常量實(shí)型常量布爾值字符型常量空值 表達(dá)式 在定義完變量后 就可以對(duì)它們進(jìn)行賦值 改變 計(jì)算等一系列操作 這一過程通常又叫稱一個(gè)叫表達(dá)式來完成 可以說它是變量 常量 布爾及運(yùn)算符的集合 因此表達(dá)式可以分為算術(shù)表述式 字串表達(dá)式 賦值表達(dá)式以及布爾表達(dá)式等 運(yùn)算符 算術(shù)運(yùn)算符比較運(yùn)算符布爾邏輯運(yùn)算符 算術(shù)運(yùn)算符 JavaScript中的算術(shù)運(yùn)算符有單目運(yùn)算符和雙目運(yùn)算符 雙目運(yùn)算符 加 減 乘 除 取模 按位或 按位與 右移 右移 零填充 單目運(yùn)算符 取反 取補(bǔ) 遞加1 遞減1 比較運(yùn)算符 比較運(yùn)算符它的基本操作過程是 首先對(duì)它的操作數(shù)進(jìn)行比較 爾后再返回一個(gè)true或False值 有 個(gè)比較運(yùn)算符 大于 大于等于 等于 不等于 布爾邏輯運(yùn)算符 在JavaScript中增加了幾個(gè)布爾邏輯運(yùn)算符 取反 與之后賦值 邏輯與 或之后賦值 邏輯或 異或之后賦值 邏輯異或 三目操作符 或 等于 不等于 其中三目操作符主要格式如下 操作數(shù) 結(jié)果 結(jié)果 若操作數(shù)的結(jié)果為真 則表述式的結(jié)果為結(jié)果 否則為結(jié)果 一個(gè)跑馬燈效果的JavaScript文檔 varmsg 這是一個(gè)跑馬燈效果的JavaScript文檔 varinterval 100 varspacelen 120 varspace10 varseq 0 functionScroll len msg length window status msg substring 0 seq 1 seq if seq len seq spacelen window setTimeout Scroll2 interval else 一個(gè)跑馬燈效果的JavaScript文檔 window setTimeout Scroll interval functionScroll2 varout for i 1 i len seq 0 window setTimeout Scroll2 interval Scroll JavaScript程序構(gòu)成 控制語句函數(shù)對(duì)象方法屬性 if條件語句 基本格式if 表述式 語句段 else語句段 功能 若表達(dá)式為true 則執(zhí)行語句段 否則執(zhí)行語句段 if語句的嵌套 if 布爾值 語句 else 布爾值 語句 elseif 布爾值 語句 else語句 在這種情況下 每一級(jí)的布爾表述式都會(huì)被計(jì)算 若為真 則執(zhí)行其相應(yīng)的語句 否則執(zhí)行else后的語句 For循環(huán)語句 基本格式for 初始化 條件 增量 語句集 功能 實(shí)現(xiàn)條件循環(huán) 當(dāng)條件成立時(shí) 執(zhí)行語句集 否則跳出循環(huán)體 說明 初始化參數(shù)告訴循環(huán)的開始位置 必須賦予變量的初值 條件 是用于判別循環(huán)停止時(shí)的條件 若條件滿足 則執(zhí)行循環(huán)體 否則跳出 增量 主要定義循環(huán)控制變量在每次循環(huán)時(shí)按什么方式變化 三個(gè)主要語句之間 必須使用逗號(hào)分隔 while循環(huán) 基本格式while 條件 語句集 該語句與For語句一樣 當(dāng)條件為真時(shí) 重復(fù)循環(huán) 否則退出循環(huán) For與while語句兩種語句都是循環(huán)語句 使用For語句在處理有關(guān)數(shù)字時(shí)更易看懂 也較緊湊 而while循環(huán)對(duì)復(fù)雜的語句效果更特別 break和continue語句 與C 語言相同 使用break語句使得循環(huán)從For或while中跳出 continue使得跳過循環(huán)內(nèi)剩余的語句而進(jìn)入下一次循環(huán) 函數(shù) 函數(shù)為程序設(shè)計(jì)人員提供了一個(gè)豐常方便的能力 通常在進(jìn)行一個(gè)復(fù)雜的程序設(shè)計(jì)時(shí) 總是根據(jù)所要完成的功能 將程序劃分為一些相對(duì)獨(dú)立的部分 每部分編寫一個(gè)函數(shù) 從而 使各部分充分獨(dú)立 任務(wù)單一 程序清晰 易懂 易讀 易維護(hù) JavaScript函數(shù)可以封裝那些在程序中可能要多次用到的模塊 并可作為事件驅(qū)動(dòng)的結(jié)果而調(diào)用的程序 從而實(shí)現(xiàn)一個(gè)函數(shù)把它與事件驅(qū)動(dòng)相關(guān)聯(lián) 這是與其它語言不樣的地方 JavaScript函數(shù)定義 Function函數(shù)名 參數(shù) 變?cè)?函數(shù)體 Return表達(dá)式 說明 當(dāng)調(diào)用函數(shù)時(shí) 所用變量或字面量均可作為變?cè)獋鬟f 函數(shù)由關(guān)鍵字Function定義 函數(shù)名 定義自己函數(shù)的名字 參數(shù)表 是傳遞給函數(shù)使用或操作的值 其值可以是常量 變量或其它表達(dá)式 通過指定函數(shù)名 實(shí)參 來調(diào)用一個(gè)函數(shù) 必須使用Return將值返回 函數(shù)名對(duì)大小寫是敏感的 函數(shù)中的形式參數(shù) 在函數(shù)的定義中 我們看到函數(shù)名后有參數(shù)表 這些參數(shù)變量可能是一個(gè)或幾個(gè) 那么怎樣才能確定參數(shù)變量的個(gè)數(shù)呢 在JavaScript中可通過arguments Length來檢查參數(shù)的個(gè)數(shù) 例 Functionfunction Name exp1 exp2 exp3 exp4 Number function Name arguments length if Number 1 document wrile exp2 if Number 2 document write exp3 if Number 3 document write exp4 事件驅(qū)動(dòng)及事件處理 JavaScript是基于對(duì)象 object based 的語言 這與Java不同 Java是面向?qū)ο蟮恼Z言 而基于對(duì)象的基本特征 就是采用事件驅(qū)動(dòng) event driven 它是在用形界面的環(huán)境下 使得一切輸入變化簡(jiǎn)單化 通常鼠標(biāo)或熱鍵的動(dòng)作我們稱之為事件 Event 而由鼠標(biāo)或熱鍵引發(fā)的一連串程序的動(dòng)作 稱之為事件驅(qū)動(dòng) EventDriver 而對(duì)事件進(jìn)行處理程序或函數(shù) 我們稱之為事件處理程序 EventHandler 事件處理程序 在JavaScript中對(duì)象事件的處理通常由函數(shù) Function 擔(dān)任 其基本格式與函數(shù)全部一樣 可以將前面所介紹的所有函數(shù)作為事件處理程序 格式如下 Function事件處理名 參數(shù)表 事件處理語句集 主要有以下幾個(gè)事件 單擊事件onClickonChange改變事件選中事件onSelect獲得焦點(diǎn)事件onFocus失去焦點(diǎn)onBlur載入文件onLoad卸載文件onUnload 范例1 調(diào)用 范例2 functionmakeArray n this length nreturnthis functionhexfromdec num hex newmakeArray 1 varhexstring varshifthex 16 vartemp1 num for x 1 x 0 x hex x Math round temp1 shifthex 5 hex x 1 temp1 hex x shifthex temp1 hex x 1 shifthex 16 for x 1 x 0 x hexstring getletter hex x return hexstring 范例2 functiongetletter num if num text substring i i 2 returnallstring 范例2 functionsizefont text varcolor d1 varallstring varflag 0 for i 0 j 0 i 7 flag 1 if flag 1 j j 1 if j text substring i i 1 returnallstring 范例2 document write document write document write sizefont 這是一個(gè)獲取WEB瀏覽器的程序 document write document write 瀏覽器名稱 navigator appName document write 版本號(hào) navigator appVersion document write 代碼名字 navigator appCodeName document write 用戶代理標(biāo)識(shí) navigator userAgent 范例2 輸出結(jié)果圖1所示 基于對(duì)象的JavaScript語言 JavaScript語言是基于對(duì)象的 Object Based 而不是面向?qū)ο蟮?object oriented 之所以說它是一門基于對(duì)象的語言 主要是因?yàn)樗鼪]有提供象抽象 繼承 重載等有關(guān)面向?qū)ο笳Z言的許多功能 而是把其它語言所創(chuàng)建的復(fù)雜對(duì)象統(tǒng)一起來 從而形成一個(gè)非常強(qiáng)大的對(duì)象系統(tǒng) 雖然JavaScript語言是一門基于對(duì)象的 但它還是具有一些面向?qū)ο蟮幕咎卣?它可以根據(jù)需要?jiǎng)?chuàng)建自己的對(duì)象 從而進(jìn)一步擴(kuò)大JavaScript的應(yīng)用范圍 增強(qiáng)編寫功能強(qiáng)大的Web文檔 對(duì)象的基礎(chǔ)知識(shí) 對(duì)象的基本結(jié)構(gòu)引用對(duì)象的途徑有關(guān)對(duì)象操作語句對(duì)象屬性的引用對(duì)象的方法的引用 對(duì)象的基本結(jié)構(gòu) JavaScript中的對(duì)象是由屬性 properties 和方法 methods 兩個(gè)基本的元素的構(gòu)成的 前者是對(duì)象在實(shí)施其所需要行為的過程中 實(shí)現(xiàn)信息的裝載單位 從而與變量相關(guān)聯(lián) 后者是指對(duì)象能夠按照設(shè)計(jì)者的意圖而被執(zhí)行 從而與特定的函數(shù)相聯(lián) 引用對(duì)象的途徑 一個(gè)對(duì)象要真正地被使用 可采用以下幾種方式 1 引用JavaScript內(nèi)部對(duì)象 2 由瀏覽器環(huán)境中提供3 創(chuàng)建新對(duì)象 這就是說一個(gè)對(duì)象在被引用之前 這個(gè)對(duì)象必須存在 否則引用將毫無意義 而出現(xiàn)錯(cuò)誤信息 從上面中我們可以看出JavaScript引用對(duì)象可通過三種方式獲取 要么創(chuàng)建新的對(duì)象 要么利用現(xiàn)存的對(duì)象 有關(guān)對(duì)象操作語句 For in語句with語句this關(guān)鍵字New運(yùn)算符 For in語句 格式如下 For 對(duì)象屬性名in已知對(duì)象名 說明 1 該語句的功能是用于對(duì)已知對(duì)象的所有屬性進(jìn)行操作的控制循環(huán) 它是將一個(gè)已知對(duì)象的所有屬性反復(fù)置給一個(gè)變量 而不是使用計(jì)數(shù)器來實(shí)現(xiàn)的 2 該語句的優(yōu)點(diǎn)就是無需知道對(duì)象中屬性的個(gè)數(shù)即可進(jìn)行操作 例 下列函數(shù)是顯示數(shù)組中的內(nèi)容 FunctionshowData object for varX 0 X 30 X document write object i 該函數(shù)是通過數(shù)組下標(biāo)順序值 來訪問每個(gè)對(duì)象的屬性 使用這種方式首先必須知道數(shù)組的下標(biāo)值 否則若超出范圍 則就會(huì)發(fā)生錯(cuò)誤 而使For in語句 則根本不需要知道對(duì)象屬性的個(gè)數(shù) 見下 FunctionshowData object for varpropinobject document write object prop 使用該函數(shù)時(shí) 在循環(huán)體中 For自動(dòng)將的屬性取出來 直到最后為此 with語句 使用該語句的意思是 在該語句體內(nèi) 任何對(duì)變量的引用被認(rèn)為是這個(gè)對(duì)象的屬性 以節(jié)省一些代碼 withobject 所有在with語句后的花括號(hào)中的語句 都是在后面object對(duì)象的作用域的 this關(guān)鍵字 this是對(duì)當(dāng)前的引用 在JavaScript由于對(duì)象的引用是多層次 多方位的 往往一個(gè)對(duì)象的引用又需要對(duì)另一個(gè)對(duì)象的引用 而另一個(gè)對(duì)象有可能又要引用另一個(gè)對(duì)象 這樣有可能造成混亂 最后自己已不知道現(xiàn)在引用的那一個(gè)對(duì)象 為此JavaScript提供了一個(gè)用于將對(duì)象指定當(dāng)前對(duì)象的語句this New運(yùn)算符 使用New運(yùn)算符可以創(chuàng)建一個(gè)新的對(duì)象 其創(chuàng)建對(duì)象使用如下格式 Newobject NEWObject Parameterstable 其中Newobject創(chuàng)建的新對(duì)象 object是已經(jīng)存在的對(duì)象 parameterstable參數(shù)表 new是JavaScript中的命令語句 如創(chuàng)建一個(gè)日期新對(duì)象newData NewData birthday NewData December12 1998 之后就可使NewData birthday作為一個(gè)新的日期對(duì)象了 對(duì)象屬性的引用 使用點(diǎn) 運(yùn)算符 university Name 廣西 通過對(duì)象的下標(biāo)實(shí)現(xiàn)引用 university 0 廣西 通過字符串的形式實(shí)現(xiàn) university Name 廣西 對(duì)象的方法的引用 在JavaScript中對(duì)象方法的引用是非常簡(jiǎn)單的 ObjectName methods 實(shí)際上methods FunctionName方法實(shí)質(zhì)上是一個(gè)函數(shù) 如引用university對(duì)象中的showmy 方法 則可使用 document write university showmy 或 document write university 如引用math內(nèi)部對(duì)象中cos 的方法則 with math document write cos 35 document write cos 80 若不使用with則引用時(shí)相對(duì)要復(fù)雜些 document write Math cos 35 document write math sin 80 常用對(duì)象的屬性和方法 JavaScript為我們提供了一些非常有用的常用內(nèi)部對(duì)象和方法 用戶不需要用腳本來實(shí)現(xiàn)這些功能 這正是基于對(duì)象編程的真正目的 在JavaScript提供了string 字符串 math 數(shù)值計(jì)算 和Date 日期 三種對(duì)象和其它一些相關(guān)的方法 從而為編程人員快速開發(fā)強(qiáng)大的腳本程序提供了非常有利的條件 常用內(nèi)部對(duì)象 在JavaScript中對(duì)于對(duì)象屬性與方法的引用 有兩種情況 其一是說該對(duì)象是靜態(tài)對(duì)象 即在引用該對(duì)象的屬性或方法時(shí)不需要為它創(chuàng)建實(shí)例 而另一種對(duì)象則在引用它的對(duì)象或方法是必須為它創(chuàng)建一個(gè)實(shí)例 即該對(duì)象是動(dòng)態(tài)對(duì)象 對(duì)JavaScript內(nèi)部對(duì)象的引用 以是緊緊圍繞著它的屬性與方法進(jìn)行的 因而明確對(duì)象的靜動(dòng)性對(duì)于掌握和理解JavaScript內(nèi)部對(duì)象是具有非常重要的意義 串對(duì)象 string對(duì)象 內(nèi)部靜態(tài)性 訪問properties和methods時(shí) 可使用 運(yùn)算符實(shí)現(xiàn) 基本使用格式 objectName prop methods 串對(duì)象的屬性 string對(duì)象只有一個(gè)屬性 即length 它表明了字符串中的字符個(gè)數(shù) 包括所有符號(hào) 例 mytest ThisisaJavaScript mystringlength mytest length最后mystringlength返回mytest字串的長(zhǎng)度為20 串對(duì)象的方法 string對(duì)象的方法共有 個(gè) 主要用于有關(guān)字符串在Web頁面中的顯示 字體大小 字體顏色 字符的搜索以及字符的大小寫轉(zhuǎn)換 其主要方法如下 o錨點(diǎn)anchor 該方法創(chuàng)建如用Html文檔中一樣的anchor標(biāo)記 使用anchor如用Html中 AName 一樣 通過下列格式訪問 string anchor anchorName o有關(guān)字符顯示的控制方法big字體顯示 Italics 斜體字顯示 bold 粗體字顯示 blink 字符閃爍顯示 small 字符用小體字顯示 fixed 固定高亮字顯示 fontsize size 控制字體大小等 o字體顏色方法 fontcolor color o字符串大小寫轉(zhuǎn)換toLowerCase 小寫轉(zhuǎn)換 toUpperCase 大寫轉(zhuǎn)換 下列把一個(gè)給定的串分別轉(zhuǎn)換成大寫和小寫格式 string stringValue toUpperCase和string stringValue toLowerCase o字符搜索 indexOf charactor fromIndex 從指定formIndtx位置開始搜索charactor第一次出現(xiàn)的位置 返回字串的一部分字串 substring start end 從start開始到end的字符全部返回 算術(shù)函數(shù)的math對(duì)象 功能 提供除加 減 乘 除以外的一引些自述運(yùn)算 如對(duì)數(shù) 平方根等 靜動(dòng)性 靜態(tài)對(duì)象主要屬性 math中提供了 個(gè)屬性 它們是數(shù)學(xué)中經(jīng)常用到的常數(shù) 以 為底的自然對(duì)數(shù) 以 為底的自然對(duì)數(shù)LN2 3 14159的PI 1 2的平方根SQRT1 2 2的平方根為SQRT2 算術(shù)函數(shù)的math對(duì)象 主要方法 絕對(duì)值 abs 正弦余弦值 sin cos 反正弦反余弦 asin acos 正切反正切 tan atan 四舍五入 round 平方根 sqrt 基于幾方次的值 Pow base exponent 日期及時(shí)間對(duì)象 功能 提供一個(gè)有關(guān)日期和時(shí)間的對(duì)象 靜動(dòng)性 動(dòng)態(tài)性 即必須使用New運(yùn)算符創(chuàng)建一個(gè)實(shí)例 例 MyDate NewDate Date對(duì)象沒有提供直接訪問的屬性 只具有獲取和設(shè)置日期和時(shí)間的方法 日期起始值 年 月 日 獲取日期的時(shí)間方法 getYear 返回年數(shù)getMonth 返回當(dāng)月號(hào)數(shù)getDate 返回當(dāng)日號(hào)數(shù)getDay 返回星期幾getHours 返回小時(shí)數(shù)getMintes 返回分鐘數(shù)getSeconds 返回秒數(shù)getTime 返回毫秒數(shù) 設(shè)置日期和時(shí)間 setYear 設(shè)置年setDate 設(shè)置當(dāng)月號(hào)數(shù)setMonth 設(shè)置當(dāng)月份數(shù)setHours 設(shè)置小時(shí)數(shù)setMintes 設(shè)置分鐘數(shù)setSeconds 設(shè)置秒數(shù)setTime 設(shè)置毫秒數(shù) JavaScript中的系統(tǒng)函數(shù) JavaScript中的系統(tǒng)函數(shù)又稱內(nèi)部方法 它提供了與任何對(duì)象無關(guān)的系統(tǒng)函數(shù) 使用這些函數(shù)不需創(chuàng)建任何實(shí)例 可直接用 1 返回字符串表達(dá)式中的值 方法名 eval 字串表達(dá)式 例 test eval 8 9 5 2 2 返回字符串ASCI碼 方法名 unEscape string 3 返回字符的編碼 方法名 escape character 4 返回實(shí)數(shù) parseFloat floustring 5 返回不同進(jìn)制的數(shù) parseInt numbestring rad X 其中radix是數(shù)的進(jìn)制 numbs字符串?dāng)?shù) 在JavaScript中創(chuàng)建新對(duì)象 使用JavaScript可以創(chuàng)建自己的對(duì)象 雖然JavaScript內(nèi)部和瀏覽器本身的功能已十分強(qiáng)大 但JavaScript還是提供了創(chuàng)建一個(gè)新對(duì)象的方法 使其不必像超文本標(biāo)識(shí)語言那樣 求于或其它多媒體工具 就能完成許多復(fù)雜的工作 在JavaScript中創(chuàng)建一個(gè)新的對(duì)象是十分簡(jiǎn)單的 首先它必須定義一個(gè)對(duì)象 而后再為該對(duì)象創(chuàng)建一個(gè)實(shí)例 這個(gè)實(shí)例就是一個(gè)新對(duì)象 它具有對(duì)象定義中的基本特征 對(duì)象的定義 JavaScript對(duì)象的定義 其基本格式如下 FunctionObject 屬性表 This prop1 prop1This prop2 prop2 This meth FunctionName1 This meth FunctionName2 在一個(gè)對(duì)象的定義中 可以為該對(duì)象指明其屬性和方法 通過屬性和方法構(gòu)成了一個(gè)對(duì)象的實(shí)例 如以下是一個(gè)關(guān)于University對(duì)象的定義 Functionuniversity name city creatDateURL This name nameThis city cityThis creatDate NewDate creatDate This URL URL其基本含義如下 Name 指定一個(gè) 單位 名稱 City 單位 所在城市 CreatDate 記載university對(duì)象的更新日期 URL 該對(duì)象指向一個(gè)網(wǎng)址 創(chuàng)建對(duì)象實(shí)例 一旦對(duì)象定義完成后 就可以為該對(duì)象創(chuàng)建一個(gè)實(shí)例了 NewObject Newobject 其中Newobjet是新的對(duì)象 Object已經(jīng)定義好的對(duì)象 例 U1 Newuniversity 云南省 昆明市 January05 199712 00 00 http www YN KM U2 Newuniversity 云南電子科技大學(xué) 昆明 January07 199712 00 00 htlp www YNKJ CN 對(duì)象方法的使用 在對(duì)象中除了使用屬性外 有時(shí)還需要使用方法 在對(duì)象的定義中 我們看到This meth FunctionName語句 那就是為定義對(duì)象的方法 實(shí)質(zhì)對(duì)象的方法就是一個(gè)函數(shù)FunctionName 通過它實(shí)現(xiàn)自己的意圖例在university對(duì)象中增加一個(gè)方法 該方法是顯示它自己本身 并返回相應(yīng)的字串 functionuniversity name city createDate URL This Name Name This city city This createDate NewDate creatDate This URL URL This showuniversity showuniversity 其中This showuniversity就是定義了一個(gè)方法 showuniversity 而showuniversity 方法是實(shí)現(xiàn)university對(duì)象本身的顯示 functionshowuniversity For varpropinthis alert prop this prop 其中alert是JavaScript中的內(nèi)部函數(shù) 顯示其字符串 JavaScript中的數(shù)組 使用New創(chuàng)建數(shù)組JavaScript中沒有提供像其它語言具有明顯的數(shù)組類型 但可以通過function定義一個(gè)數(shù)組 并使用New對(duì)象操作符創(chuàng)建一個(gè)具有下標(biāo)的數(shù)組 從而可以實(shí)現(xiàn)任何數(shù)據(jù)類型的存儲(chǔ) 定義對(duì)象的數(shù)組 FunctionarrayName size This length Size for varX X size X this X 0 Returethis 其中arrayName是定義數(shù)組的一個(gè)名子 Size是有關(guān)數(shù)組大小的值 1 size 即數(shù)組元素的個(gè)數(shù) 通過for循環(huán)對(duì)一個(gè)當(dāng)前對(duì)象的數(shù)組進(jìn)行定義 最后返回這個(gè)數(shù)組 創(chuàng)建數(shù)組實(shí)例 一個(gè)數(shù)組定義完成以后 還不能馬上使用 必須為該數(shù)組創(chuàng)建一個(gè)數(shù)組實(shí)例 Myarray NewarrayName n 并賦于初值 Myarray 1 字串 Myarray 2 字串 Myarray 3 字串 Myarray n 字串n 一旦給數(shù)組賦于了初值后 數(shù)組中就具有真正意義的數(shù)據(jù)了 以后就可以在程序設(shè)計(jì)過程中直接引用 創(chuàng)建多維數(shù)組 FunctioncreatMArray row col varindx 0 this length row 10 colfor varx 1 x row x for vary 1 y col y indx x 10 y this indx myMArray newcreatMArray 之后可通過myMArray 11 myMArray 12 myMArray 13 myMArray 21 myMArray 22 myMArray 23 來引用 內(nèi)部數(shù)組 在Java中為了方便內(nèi)部對(duì)象的操作 可以使用窗體 Forms 框架 Frames 元素 element 鏈接 links 和錨 Anchors 數(shù)組實(shí)現(xiàn)對(duì)象的訪問 anchors 使用 Aname anchorName 標(biāo)識(shí)來建立錨的鏈接 links 使用來定義一個(gè)越文本鏈接項(xiàng) Forms 在程序中使用多窗體時(shí) 建立該數(shù)組 Elements 在一個(gè)窗口中使用從個(gè)元素時(shí) 建立該數(shù)組 Frames 建立框架時(shí) 使用該數(shù)組anchors 用于窗體的訪問 它是通過 formname form1 所指定的 link 用于被鏈接到的錨點(diǎn)的訪問 它是通過 ahref URL 所指定的 Forms 反映窗體的屬性 而anchors 反映Web頁面中的鏈接屬性 JavaScript對(duì)象系統(tǒng)的使用 使用瀏覽器的內(nèi)部對(duì)象系統(tǒng) 可實(shí)現(xiàn)與HTML文檔進(jìn)行交互 它的作用是將相關(guān)元素組織包裝起來 提供給程序設(shè)計(jì)人員使用 從而減輕編程人的勞動(dòng) 提高設(shè)計(jì)Web頁面的能力 編程人員利用這些對(duì)象 可以對(duì)WWW瀏覽器環(huán)境中的事件進(jìn)行控制并作出處理 在JavaScript中提供了非常豐富的內(nèi)部方法和屬性 從而減輕了編程人員的工作 提高編程效率 JavaScript對(duì)象系統(tǒng) 瀏覽器對(duì)象 Navigator 窗口對(duì)象 Window 文檔對(duì)象 Document 位置對(duì)象 Location 歷史對(duì)象 History 在這些對(duì)象系統(tǒng)中 文檔對(duì)象非常重要 它位于最低層 但對(duì)于我們實(shí)現(xiàn)Web頁面信息交互起作關(guān)鍵作用 因而它是對(duì)象系統(tǒng)的核心部分 document對(duì)象的主要作用 document對(duì)象的主要作用就是把這些基本的元素 如links anchor等 包裝起來 提供給編程人員使用 從另一個(gè)角度看 document對(duì)象中又是由屬性和方法組成 文檔對(duì)象中的attribute屬性 document對(duì)象中的attribute屬性 主要用于在引用Href標(biāo)識(shí)時(shí) 控制著有關(guān)顏色的格式和有關(guān)文檔標(biāo)題 文檔原文件的URL以及文檔最后更新的日期 這部分元素的主要含義如下 鏈接顏色 alinkcolor這個(gè)元素主要用于 當(dāng)選取一個(gè)鏈接時(shí) 鏈接對(duì)象本身的顏色就按alinkcolor指定改變 鏈接顏色 linkcolor當(dāng)用戶使用Textstring鏈接后 Textstring的顏色就會(huì)按Linkcolor所指定的顏色更新 瀏覽過后的顏色 VlinkColor該屬性表示的是已被瀏覽存儲(chǔ)為已瀏覽過的鏈接顏色 背景顏色 bgcolor該元素包含文檔背景的顏色 前景顏色 Fgcolor該元素包含HTML文檔中文本的前景顏色 文檔對(duì)象的基本元素 窗體屬性 窗體屬性是與HTML文檔中 相對(duì)應(yīng)的一組對(duì)象在HTML文檔所創(chuàng)建的窗體數(shù) 由length指定 通過document forms length反映該文檔中所創(chuàng)建的窗體數(shù)目 錨屬性 anchors該屬性中 包含了HTML文檔的所有標(biāo)記為Name 的語句標(biāo)識(shí) 所有 錨 的數(shù)目保存在document anchors length中 鏈接屬性 links鏈接屬性是指在文檔中 的由Href 指定的數(shù)目 其鏈接數(shù)目保存在document links length中 JavaScript窗口及輸入輸出 JavaScript是基于對(duì)象的腳本編程語言 那么它的輸入輸出就是通過對(duì)象來完成的 其中有關(guān)輸入可通過窗口 Window 對(duì)象來完成 而輸出可通過文檔 document 對(duì)象的方法來實(shí)現(xiàn) 窗口及輸入輸出 請(qǐng)看下面例子 Vartest window prompt 請(qǐng)輸入數(shù)據(jù) document write test JavaScript輸入輸出的例子 其中window prompt 就是一個(gè)窗口對(duì)象的方法 其基本作用是 當(dāng)裝入Web頁面時(shí)在屏幕上顯示一個(gè)具有 確定 和 取消 的對(duì)話框 讓你輸出數(shù)據(jù) document writle是一個(gè)文檔對(duì)象的方法 它的基本功能 是實(shí)現(xiàn)Web頁面的輸出顯示 窗口對(duì)象 該對(duì)象包括許多有用的屬性 方法和事件驅(qū)動(dòng)程序 編程人員可以利用這些對(duì)象控制瀏覽器窗口顯示的各個(gè)方面 如對(duì)話框 框架等 在使用應(yīng)注意以下幾點(diǎn) 該對(duì)象對(duì)應(yīng)于HTML文檔中的和兩種標(biāo)識(shí) onload和onunload都是窗口對(duì)象屬性 在JavaScript腳本中可直接引用窗口對(duì)象 如 window alert 窗口對(duì)象輸入方法 可直接使用以下格式 alert 窗口對(duì)象輸入方法 窗口對(duì)象的事件驅(qū)動(dòng) 窗口對(duì)象主要有裝入Web文檔事件onload和卸載時(shí)onunload事件 用于文檔載入和停止載入時(shí)開始和停止更新文檔 窗口對(duì)象的方法 窗口對(duì)象的方法主要用來提供信息或輸入數(shù)據(jù)以及創(chuàng)建一個(gè)新的窗口 創(chuàng)建一個(gè)新窗口open 使用window open 參數(shù)表 方法可以創(chuàng)建一個(gè)新的窗口 其中參數(shù)表提供有窗口的主要特性和文檔及窗口的命名 具有OK按鈕的對(duì)話框alert 方法能創(chuàng)建一個(gè)具有OK按鈕的對(duì)話框 具有OK和Cancel按鈕的對(duì)話框confirm 方法為編程人員提供一個(gè)具有兩個(gè)按鈕的對(duì)話框 具有輸入信息的對(duì)話框prompt 方法允許用戶在對(duì)話框中輸入信息 并可使用默認(rèn)值 其基本格式如下prompt 提示信息 默認(rèn)值 窗口對(duì)象中的屬性 窗口對(duì)象中的屬性主要用來對(duì)瀏覽器中存在的各種窗口和框架的引用 其主要屬性有以下幾個(gè) frames確文檔中幀的數(shù)目frames 幀 作為實(shí)現(xiàn)一個(gè)窗口的分隔操作 起到非常有用的作用 在使用注意以下幾點(diǎn) frames屬性是通過HTML標(biāo)識(shí)的順序來引用的 它包含了一個(gè)窗口中的全部幀數(shù) 幀本身已是一類窗口 繼承了窗口對(duì)象所有的全部屬性和方法 Parent指明當(dāng)前窗口或幀的父窗口 defaultstatus 默認(rèn)狀態(tài) 它的值顯示在窗口的狀態(tài)欄中 status 包含文檔窗口中幀中的當(dāng)前信息 top 包括的是用以實(shí)現(xiàn)所有的下級(jí)窗口的窗口 window 指的是當(dāng)前窗口 self 引用當(dāng)前窗口 輸出流及文檔對(duì)象 在JavaScript文檔對(duì)象中 提供了用于顯示關(guān)閉 消除 打開HTML頁面的輸出流 創(chuàng)建新文檔open 方法write writeln 輸出顯示關(guān)閉文檔流close 清除文檔內(nèi)容clear 簡(jiǎn)單的輸入 輸出例子 輸入 Window prompt 提示信 預(yù)定輸入信息 輸出 document write 方法和document writeln 方法說明 write 和writeln 方法都是用于向?yàn)g覽器窗口輸出文本字串 二者的唯一區(qū)別就是writeln 方法自動(dòng)在文本之后加入回車符 window alert 輸出 在JavaScript為了方便信息輸出 JavaScript提供了具有獨(dú)立的對(duì)話框信息輸出 alert 方法 利用輸入 輸出方法實(shí)現(xiàn)交互 有關(guān)交互的例子 my prompt 請(qǐng)輸入數(shù)據(jù) document write my document close StopHidingfromOtherBrowsers 從上面程序可以看出 可通過write 和prompt 方法實(shí)現(xiàn)交互 在JavaScript腳本語言中可以使用HTML標(biāo)識(shí)語言的代碼 從而實(shí)現(xiàn)混合編程 其中和就是HTML標(biāo)識(shí)符 窗體基礎(chǔ)知識(shí) 窗體對(duì)象可以使設(shè)計(jì)人員能用窗體中不同的元素與客戶機(jī)用戶相交互 而用不著在之前首先進(jìn)行數(shù)據(jù)輸入 就可以實(shí)現(xiàn)動(dòng)態(tài)改變Web文檔的行為 什么是窗體對(duì)象 窗體 Form 它是構(gòu)成了Web頁面的基本元素 通常一個(gè)Web頁面有一個(gè)窗體或幾個(gè)窗體 使用Forms 數(shù)組來實(shí)現(xiàn)不同窗體的訪問 窗體對(duì)象的方法 窗體對(duì)象的方法只有一個(gè) submit 方法 該方法主要功用就是實(shí)現(xiàn)窗體信息的提交 如提交Mytest窗體 則使用下列格式 document mytest submit 窗體對(duì)象的屬性 窗體對(duì)象中的屬性主要包括以下 elementsnameactiontargetencodingmethod 除Elements外 其它幾個(gè)均反映了窗體中標(biāo)識(shí)中相應(yīng)屬性的狀態(tài) 這通常是單個(gè)窗體標(biāo)識(shí) 而elements常常是多個(gè)窗體元素值的數(shù)組 例 elements 0 Mytable elements 1 訪問窗體對(duì)象 在JavaScript中訪問窗體對(duì)象可由兩種方法實(shí)現(xiàn) 通過訪問窗體在窗體對(duì)象的屬性中首先必須指定其窗體名 而后就可以通過下列標(biāo)識(shí)訪問窗體如 document Mytable 通過數(shù)組來訪問窗體除了使用窗體名來訪問窗體外 還可以使用窗體對(duì)象數(shù)組來訪問窗體對(duì)象 但需要注意一點(diǎn) 因窗體對(duì)象是由瀏覽器環(huán)境的提供的 而瀏覽器環(huán)境所提供的數(shù)組下標(biāo)是由0到n 所以可通過下列格式實(shí)現(xiàn)窗體對(duì)象的訪問 document forms 0 document forms 1 document forms 2 引用窗體的先決條件 在JavaScript中要對(duì)窗體引用的條件是 必須先在頁面中用標(biāo)識(shí)創(chuàng)建窗體 并將定義窗體部分放在引用之前 窗體中的基本元素 窗體中的基本元素由按鈕 單選按鈕 復(fù)選按鈕 提交按鈕 重置按鈕 文本框等組成 在JavaScript中要訪問這些基本元素 必須通過對(duì)應(yīng)特定的窗體元素的數(shù)組下標(biāo)或窗體元素名來實(shí)現(xiàn) 每一個(gè)元素主要是通過該元素的屬性或方法來引用 其引用的基本格式見下 formName elements methadName 窗體名 元素名或數(shù)組 方法 formName elemaent propertyName 窗體名 元素名或數(shù)組 屬性 什么是框架 框架Frames最主要功用是 分割 視窗 使每個(gè) 小視窗 能顯示不同的HTML文件 不同框架之間可以互動(dòng) interact 這就是說不同框架之間可以交換訊息與資料 例如 假設(shè)您開了兩個(gè)frames 第一個(gè)frame可顯示書的目錄 第二個(gè)frame則顯示章節(jié)的具體內(nèi)容 框架可以將屏幕分割成不同的區(qū)域 每個(gè)區(qū)域有自己的URL 通過Frames 數(shù)組對(duì)象來實(shí)現(xiàn)不同框架的訪問 實(shí)際上框架對(duì)象本身也一類窗口 它繼承了窗口對(duì)象的所有特征 并擁有所有的屬性和方法 一下框架的例子 一下框架的例子 以上HTML標(biāo)識(shí)將屏幕分成三個(gè)框架 先將窗口分成以二行為單位的窗口 之后再按分成二個(gè)窗口 并在相應(yīng)的框架中放入自己的HTML文檔 通過 Framset 告訴瀏覽器您要設(shè)置幾個(gè)框架 rows這項(xiàng)參數(shù)告訴瀏覽器您想將視窗分割成幾列 而cols這項(xiàng)參數(shù)是告訴瀏覽器您想將視窗分割成幾行 可以用很多組的tags將視窗分割得更復(fù)雜 可以給每個(gè)frame一個(gè) 名字 name frame的名字在JavaScript語法中的地位非常重要 可以用告訴瀏覽器您要載入哪一個(gè)HTML文件 如何訪問框架 在前面我們介紹過使用document forms 實(shí)現(xiàn)單一窗體中不同元素的訪問 而要實(shí)現(xiàn)框架中多窗體的不同元素的訪問 則必須使用window對(duì)象中的Frames屬性 Frames屬性同樣也是一個(gè)數(shù)組 他在父框架集中為每一個(gè)子框架設(shè)有一項(xiàng) 通過下標(biāo)實(shí)現(xiàn)不同框架的訪問 parent frames Index1 docuement forms index2 通過parent frames length確定窗口中窗體的數(shù)目 除了使用數(shù)組下標(biāo)來訪問窗體外還可以使用框架名和窗體名來實(shí)現(xiàn)各元素的訪 parent framesName decument formNames elementName m p