JavaScript深度剖析(從入門到精通)

1、第一講javascript語言概況第二講javascript基本數(shù)據(jù)結(jié)構(gòu)第三講javascript程序構(gòu)成第四講 基于對象的javascript語言第五講創(chuàng)建新對象第六講使用內(nèi)部對象系統(tǒng)第七講窗口及輸入輸出第八講web頁面信息的交互第九講實現(xiàn)更復(fù)雜的交互第一講javascript語言概況internet時代，造就了我們新的工作和生活方式，其互聯(lián)性、開放性和共享信息的模式，打破了傳統(tǒng)信息傳播方式的重重壁住，為我們帶來了新的機(jī)遇隨著計算機(jī)和信息時代的到來，人類社會前進(jìn)的 腳步在逐漸加快，每一天都有新的事情發(fā)生，每一天都在創(chuàng)造著奇跡。隨著internet技術(shù)的突e猛進(jìn)，各 行各業(yè)都在加入intern

2、et的行業(yè)中來。無論從管理方面，還是從商業(yè)角度來看internet都可以帶來無限 生機(jī)。通過internet,可以實現(xiàn)地區(qū)、集體乃至個人的連接，從而達(dá)到一種“統(tǒng)一的和諧”。那么怎樣把自己 的或公司的信息資源加入到www服務(wù)器，是廣大用戶日益關(guān)心的問題。采用超鏈技術(shù)(超文本和超媒 體技術(shù))是實現(xiàn)這個目標(biāo)最簡單的、最快速的手段和途徑。具體實現(xiàn)這種手段的支持環(huán)境，那就是html 超文本標(biāo)識語言。通過它們可制作所需的web網(wǎng)頁。通過超文本(hyper text)和超媒體(hyper media)技術(shù)結(jié)合超鏈接(hyper link)的鏈接功能將各種信息組織成網(wǎng)絡(luò)結(jié)構(gòu)(web),構(gòu)成網(wǎng)絡(luò)文檔(docum

3、ent),實現(xiàn)internet上的"漫游”。通過html符號的描述就可以實現(xiàn)文字、表格、聲音、圖像、動畫等多媒體信息的檢索。然而采用這種超鏈技術(shù)存在有一定的缺陷，那就是它只能提供一種靜態(tài)的信息資源，缺少動態(tài)的客戶端與服務(wù)器端的交互。雖然可通過cgi (common gateway interface)通用網(wǎng)關(guān)接口實現(xiàn)一定的交互，但由于 該方法編程較為復(fù)雜，因而在一段時間防礙了 internet技術(shù)的發(fā)展。而javascript的出現(xiàn)，無凝為internet 網(wǎng)上用戶帶來了一線生機(jī)?？梢赃@樣說,javascript的出現(xiàn)是時代的需求，是當(dāng)今的信息時代造就了 javascriptojav

4、ascript的出現(xiàn)，它可以使得信息和用戶之間不僅只是一種顯示和瀏覽的關(guān)系，而是實現(xiàn)了一種實時的、 動態(tài)的、可交式的表達(dá)能力。從而基于cgi靜態(tài)的html頁面將被可提供動態(tài)實時信息，并對客戶操作進(jìn) 行反應(yīng)的web頁面的取代。javascript腳本正是滿足這種需求而產(chǎn)生的語言。它深受廣泛用八的喜愛的歡 迎。它是眾多腳本語言中較為優(yōu)秀的一種，它與www的結(jié)合有效地實現(xiàn)了網(wǎng)絡(luò)計算和網(wǎng)絡(luò)計算機(jī)的藍(lán)圖。 無凝java家族將占領(lǐng)internet網(wǎng)絡(luò)的主導(dǎo)地位。因此，盡快掌握j avascript腳本語言編程方法是我國廣大用戶日益關(guān)心的、什么是 javascriptjavascript是一種基于對象(ob

5、ject)和事件驅(qū)動(event driven)并具有安全性能的腳本語言。使用它的目的 是與html超文本標(biāo)記語言、java腳本語言(java小程序)一起實現(xiàn)在一個web頁面中鏈接多個對象， 與web客戶交互作用。從而可以開發(fā)客戶端的應(yīng)用程序等。它是通過嵌入或調(diào)入在標(biāo)準(zhǔn)的html語言中 實現(xiàn)的。它的出現(xiàn)彌補(bǔ)了 html語言的缺陷，它是java與html折衷的選擇，具有以下幾個基本特點(diǎn)： 是一種腳本編寫語言javascript是一種腳本語言，它采用小程序段的方式實現(xiàn)編程。像其它腳本語言一樣.javascript同樣已是 一種解釋性語言，它提供了 一個易的開發(fā)過程。它的基本結(jié)構(gòu)形式與c、c+、vb

6、、delphi +分類似°但它不像這些語言一樣，需要先編譯，而是在程序 運(yùn)行過程中被逐行地解禪。它與html標(biāo)識結(jié)合在一起，從而方便用戶的使用操作?；趯ο蟮恼Z言。javascript是一種基于對象的語言，同時以可以看作一種面向?qū)ο蟮?。這意味著它能運(yùn)用自己已經(jīng)創(chuàng)建的 對象。因此，許多功能可以來自于腳本環(huán)境中對象的方法與腳本的相互作用。簡單性javascript的簡單性主要體現(xiàn)在：首先它是一種基于java基本語句和控制流之上的簡單而緊湊的設(shè)計，從 而對于學(xué)習(xí)java是一種非常好的過渡，其次它的變量類型是采用弱類型，并未使用嚴(yán)格的數(shù)據(jù)類型 安全性javascript是一種安全性語言，它不

7、允許訪問本地的硬盤，并不能將數(shù)據(jù)存入到服務(wù)器上，不允許對網(wǎng)絡(luò) 文檔進(jìn)行修改和刪除，只能通過瀏覽器實現(xiàn)信息瀏覽或動態(tài)交互°從而有效地防止數(shù)據(jù)的丟失。動態(tài)性的javascript是動態(tài)的，它可以直接對用戶或客戶輸入做出響應(yīng)，無須經(jīng)過web服務(wù)程序。它對用戶的反映 響應(yīng)，杲采用以事件驅(qū)動的方式進(jìn)行的.所謂事件驅(qū)動，就杲指在主頁(home page)中執(zhí)行了某種操作所 產(chǎn)生的動作，就稱為“事件”(event)。比如按下鼠標(biāo)、移動窗口、選擇菜單等都可以視為事件。當(dāng)事件發(fā)生 后，可能會引起相應(yīng)的事件響應(yīng)?？缙脚_性javascript是依賴于瀏覽器本身，與操作環(huán)境無關(guān)，只要能運(yùn)行瀏覽器的計算機(jī)，并

8、支持javascript的瀏 覽器就可正確執(zhí)行。從而實現(xiàn)了“編寫一次,走遍天下”的夢想。個字處理軟件及一瀏覽器，無須web服務(wù)器通道，通過自己的電腦即可完成所有的事情。綜合所述javascript杲一種新的描述語言，它可以被箝入到html的文件之中。javascript語言可以 做到回應(yīng)使用者的需求事件(如：form的輸入)，而不用任何的網(wǎng)路來回傳輸資料，所以當(dāng)一位使用者 輸入一項資料時，它不用經(jīng)過傳給伺服端(server)處理，再傳回來的過程，而直接可以被客戶端(client)的 應(yīng)用程式所處理。javascript和java很類似，但到底并不一樣！ java是一種比javascript更復(fù)

9、朵許多的程式語言，而 javascript則是相當(dāng)容易了解的語言。javascript創(chuàng)作者可以不那麼注重程式技巧，所以許多java的 特性在java script中并不支援。二、javascript 和 java 的區(qū)別雖然javascript與java有緊密的聯(lián)系，但卻是兩個公司刃:發(fā)的不同的兩個產(chǎn)品° java是sun公司推出 的新一代面向?qū)ο蟮某绦蛟O(shè)計語言，特別適合于internet應(yīng)用程序開發(fā)；而javascript是netscape公司 的產(chǎn)品，其目的是為了擴(kuò)展netscape navigator功能，而開發(fā)的一種可以嵌入web頁面中的基于對象和事 件驅(qū)動的解釋性語言，它

10、的前身是live script ；而java的前身是oak語言。下面對兩種語言間的異同作 如下比較：基于對象和面向?qū)ο骿ava是一種真正的面向?qū)ο蟮恼Z言，即使是開發(fā)簡單的程序，必須設(shè)計對象"javascript是種腳本語言，它可以用來制作號網(wǎng)絡(luò)無關(guān)的，號用戶交互作用的復(fù)雜軟件。它是一種基于對 象(object based)和事件驅(qū)動(event driver)的編程語言。因而它本身提供了非常豐富的內(nèi)部對象供 設(shè)計人員使用。解釋和編譯兩種語言在其瀏覽器中所執(zhí)行的方式不一樣。java的源代碼在傳遞到客戶端執(zhí)行之前，必須經(jīng)過編譯，因 而客戶端上必須具有相應(yīng)平臺上的仿真器或解釋器，它可以通過

11、編譯器或解釋器實現(xiàn)獨(dú)立于某個特定的平 臺編譯代碼的束縛。javascript是一種解禪性編程諂言，其源代碼在發(fā)往客戶端執(zhí)行之前不需經(jīng)過編譯，而是將文本格式的字 符代碼發(fā)送給客戶編由瀏覽器解釋執(zhí)行。強(qiáng)變量和弱變量兩種語言所采取的變量是不一樣的。java采用強(qiáng)類型變量檢查，即所有變量在編譯之前必須作聲明。如:integer x；string y；x=1234；x=4321 ；其中x=1234說明是一個整數(shù)，y=4321說明是一個字符串。javascript中變量聲明，采用其弱類型。即變量在使用前不需作聲明，而是解釋器在運(yùn)行時檢杳其數(shù)據(jù)類 型，如：x=1234；y = .java運(yùn)行環(huán)境4321&q

12、uot;；前者說明x為其數(shù)值型變量，而后者說明y為字符型變量°代碼格式不一樣java是一種與html無關(guān)的格式，必須通過像html中引用外媒體那么進(jìn)行裝載，其代碼以字節(jié)代碼的 形式保存在獨(dú)立的文檔中。javascript的代碼杲一種文本字符格式，可以直接嵌入html文檔中，并且可動態(tài)裝載。編寫html文檔 就像編輯文本文件一樣方便匸嵌入方式不一樣在html文檔中，兩種編程語言的標(biāo)識不同，javascript使用<script>.</script>來標(biāo)識，而java使用<applet>. </applet> 來標(biāo)識。靜態(tài)聯(lián)編和動態(tài)聯(lián)編ja

13、va采用靜態(tài)聯(lián)編，即java的對象引用必須在編譯時的進(jìn)行，以使編譯器能夠?qū)崿F(xiàn)強(qiáng)類型檢杳。javascript采用動態(tài)聯(lián)編，即javascript的対象引用在運(yùn)行時進(jìn)行檢查，如不經(jīng)編譯則就無法實現(xiàn)對象引 用的檢查。軟件壞境：windows 95/98 或 windows nt。netscape navigator x.o 或 in ternet explorer x.o。用于編輯html文檔的字符編輯器（ws、wps、notepad. wordpad等）或html文檔編輯器。硬件配置：首先必須具備運(yùn)行windows 95/98或windows nt的基本硬件配置環(huán)境。推薦：基本內(nèi)存32mocrt

14、只少需要256顏色，分辨率在640x480以上。cpu只少233以上。鼠標(biāo)和其它外部設(shè)置（根據(jù)需要選用）。四、編寫第一個javascript程序下面我們通過一個例子，編寫第一個javascript程序。通過它可說明javascript的腳本是怎樣被嵌入到html文檔中的。testl .html 文檔:<html><head><script language ="javascript,>/ javascript appears here alertf"歡迎你進(jìn)入javascript世界!“）；alert（"今后我們將共同學(xué)習(xí)jav

15、ascript知識！ “）;</script></head>回我的電腦在internet explore5.0中運(yùn)行行后的結(jié)果見圖1 一 1所示文件（£）編輯g）查看辺 轉(zhuǎn)到© 收藏）jk3后追 前進(jìn) 停止刷新主頁i搜索 收藏歷史全屏地址 )|密1 d: javascripj 1. htm椎接internet explorer 新聞internet 開始自正在i圖1 一 1程序運(yùn)行的結(jié)果說明：test.html是html文檔，其標(biāo)識格式為標(biāo)準(zhǔn)的html格式；它在描述頁面的如同html標(biāo)識語言一樣，javascript程序代碼是一些可用字處理軟件瀏覽的

16、文本,html相關(guān)區(qū)域出現(xiàn)。="javascript">.</script>之間就可加入 javascript 腳本alerto是javascript的窗口對象方法，其功能杲彈出一個具有ok對話框并顯示（）中的字符串通過標(biāo)識說明：若不認(rèn)識javascript代碼的瀏覽器，則所有在其中的標(biāo)講均被忽略；若認(rèn)識，則執(zhí)行其結(jié)果，使用注釋這是一個好的編程習(xí)慣，它使其他人可以讀帰你的語言。javascript 以 </script> 標(biāo)簽結(jié)束。從上面的實例分析中我們可以看出，編寫一個javascript程序確實非常容易的°第二講javascrip

17、t基本數(shù)據(jù)結(jié)構(gòu)javascript提供腳本語言的編程與c+非常相似，它只是去掉了 c語言中有關(guān)指針等容易產(chǎn)生的 錯謀，并提供了功能強(qiáng)大的類庫。對于已經(jīng)具備c+或c語言的人來說，學(xué)習(xí)javascript腳本語言是一件 非常輕松愉快的事、javascript代碼的加入javascript的腳本包括在html中，它成為html文檔的一部分。與html標(biāo)識相結(jié)合，構(gòu)成了一個功能強(qiáng)大的internet網(wǎng)上編程語言。可以直接將javascript腳本加入文檔:<script language javascript"javascript語言代碼；javascript語言代碼； </sc

18、ript>說明：通過標(biāo)識<script>.</script>指明javascript腳本源代碼將放入其間。javascript中使用的語言。下面是將javascript腳本加入web文檔中的例子:test2.html<html><head><script language =,javascript,> document. write（"這是電腦報網(wǎng)絡(luò)學(xué)校”）; document. closeo；</script></head></html>在瀏覽器的窗口中調(diào)用test2.html,則

19、顯示'這是電腦報網(wǎng)絡(luò)學(xué)校”字串。見圖2所示。梓圖噸回 |口| x|文件(£)編4 d入jawas cr i也地址|倉1 d： jwascriptes 鏈接 internet explorer 新卩這是電腦報網(wǎng)絡(luò)學(xué)校說明：document. writeo是文檔對象的輸出函數(shù)，其功能是將括號中的字符或變量值輸岀到窗口 ； document. closeo是將輸出關(guān)閉。可將<script>.</script>標(biāo)識放入 head>. </head>或<body> .v/body>之間。將 javascript 標(biāo)識 放置&l

20、t;head>. </head>在頭部之間，使之在主頁和其余部分代碼之前裝載，從而可使代碼的功能更強(qiáng)大； 可以將javascript標(biāo)識放置在<body>. </body>主體之間以實現(xiàn)某些部分動態(tài)地創(chuàng)建文檔。二、基本數(shù)據(jù)類型javascript腳本語言同其它語言一樣，有它自身的基本數(shù)據(jù)類型、表達(dá)式和算術(shù)運(yùn)算符以及程序的基本框 架結(jié)構(gòu)。javascript提供了四種基本的數(shù)據(jù)類型用來處理數(shù)字和文字，而變量提供存放信息的地方，表達(dá) 式則可以完成較復(fù)雜的信息處理。1、基本數(shù)據(jù)類型在javascript中四種基本的數(shù)據(jù)類型：數(shù)值（整數(shù)和實數(shù)）、字符串型（用“

21、”號或'括起來的字符或數(shù)值）、 布爾型（使true或false表示）和空值。在javascript的基本類型中的數(shù)據(jù)可以是常量，也可以變量。 由于javascript采用弱類型的形式，因而一個數(shù)據(jù)的變量或常量不必首先作聲明，而是在使用或賦值時確 定其數(shù)據(jù)的類型的u當(dāng)然也可以先聲明該數(shù)據(jù)的類型,它是通過在賦值時自動說明其數(shù)據(jù)類型的。2、常量整型常量javascript的常量通常又稱字面常量，它是不能改變的數(shù)據(jù)。其整型常量可以使用十六進(jìn)制、八進(jìn)制和十 進(jìn)制表示其值。實型常量實型常量是由整數(shù)部分加小數(shù)部分表示，如12.32、193.98。可以使用科學(xué)或標(biāo)準(zhǔn)方法表示：5e7、4e5布爾值布爾常

22、量只有兩種狀態(tài)：true或falsed它主要用來說明或代表一種狀態(tài)或標(biāo)志，以說明操作流程。它與c + +是不一樣的，c + +可以用1或0表示其狀態(tài)，而javascript只能用true或false表示其狀態(tài)。字符型常量使用單引號c）或雙引號（“）括起來的一個或幾個字符。如"this is a book of javascript "、"3245"、"ewrt234234"等?？罩礿avascript中有一個空值null,表示什么也沒有=如試圖引用沒有定義的變量，則返回一個null值。特殊字符同c語言一樣，javascript中同樣以

23、有些以反斜杠（/）開頭的不可顯示的特殊字符。通常稱為控制字符。3、變量變量的主要作用是存取數(shù)據(jù)、提供存放信息的容器。對于變量必須明確變量的命名、變量的類型、變量的 聲明及其變量的作用域。變量的命名javascript中的變量命名同其計算機(jī)語言非常相似，這里要注意以下兩點(diǎn)：a、必須是一個有效的變量，即變量以字母開頭，中間可以出現(xiàn)數(shù)字如testl. text2等。除下劃線（一）作為連字符外，變量名稱不能有空格、（+ ）、（-）、（，）或其它符號。b、不能使用javascript中的關(guān)鍵字作為變量。在javascript中定義了 4 0多個類鍵字，這些關(guān)鍵是j avascript內(nèi)部使用的，不能作為

24、變量的名稱。如var、int、double, true不能作為變量的名稱。在對變量命名時，最好把變量的意義與其代表的意思對應(yīng)起來，以免出現(xiàn)錯誤。變量的類型在javascript中，變量可以用命令var作聲明：var mytest；該例子定義了一個mytest變量。但沒有賦予它的值。var mytest=,this is a book”該例子定義了一個mytest變量，同時賦予了它的值。在javascript中，變量以可以不作聲明，而在使用時再根據(jù)數(shù)據(jù)的類型來確其變量的類型。如：x=100y=,125"xy= t ruecost=19.5 等。其中x整數(shù)，y為字符串，xy為布爾型，co

25、st為實型。變屋的聲明及其作用域javascript變量可以在使用前先作聲明，并可賦值。通過使用va關(guān)鍵字對變量作聲明。對變量作聲明的 最大好處就是能及時發(fā)現(xiàn)代碼中的錯謀；因為javascript是采用動態(tài)編譯的，而動態(tài)編譯是不易發(fā)現(xiàn)代碼 中的錯謀，特別是變量命名的方面。對于變量還有一個重要性那就是變量的作用域。在javascript中同樣有全局變量和局部變量。全局變可見的，而對其它函數(shù)則是不可見的。三、表達(dá)式和運(yùn)算符1、表達(dá)式在定義完變量后，就可以對它們進(jìn)行賦值、改變、計算等一系列操作，這一過程通常又叫稱一個叫表達(dá)式 來完成，可以說它是變量、常量、布爾及運(yùn)算符的集合，因此表達(dá)式可以分為算術(shù)表

26、述式、字串表達(dá)式、 賦值表達(dá)式以及布爾表達(dá)式等。2、運(yùn)算符運(yùn)算符完成操作的一系列符號，在javascript中有算術(shù)運(yùn)算符，如+、-、*、/等；有比較運(yùn)算符如！=、=等；有邏輯布爾運(yùn)算符如?。ㄈ》矗⒇?、ii；有字串運(yùn)算如+、+=等。在javascript主要有雙目運(yùn)算符和單目運(yùn)算符。其雙目運(yùn)算符由下列組成：操作數(shù)1運(yùn)算符操作數(shù)2即由兩個操作數(shù)和一個運(yùn)算符糾成。如50 + 40、"this"+“that"等。單目運(yùn)算符，只需一個操作數(shù)，其運(yùn)算符可在前或后。（1 ）算術(shù)運(yùn)算符javascript中的算術(shù)運(yùn)算符有單目運(yùn)算符和雙目運(yùn)算符。雙目運(yùn)算符：+ （加）、-（減）

27、、* （乘）、/ （除）、 （取模）、丨（按位或）、&（按位與）、« （左移）、 （右移）、（右移，零填充）。單目運(yùn)算符：-（取反）、 （取補(bǔ)）、+ （遞加1）、一（遞減1） o（2）比較運(yùn)算符比較運(yùn)算符它的基本操作過程是，首先對它的操作數(shù)進(jìn)行比鮫，爾后再返回一個true或false值，有8個比較運(yùn)算符：<（小于）、>（大于）、<=（小于等于）、>=（大于等于）、=（等于）、！=（不等于）。（3）布爾邏輯運(yùn)算符在javascript中增加了幾個布爾邏輯運(yùn)算符：!（取反）、&二（與之后賦值）、& （邏輯與）、1=（或之后賦值）、丨（邏輯或

28、）、八二（界或之后賦值）、八（邏輯異或）、?：（三目操作符）、丨i （或）、=（等于）、1=（不等于）。其中三目操作符主要格式如下：操作數(shù)？結(jié)果1:結(jié)果2若操作數(shù)的結(jié)果為真，則表述式的結(jié)果為結(jié)果1 ,否則為結(jié)果2。四、范例下面是一個跑馬燈效果的javascript文檔。test2_1 .html<html><head><script language="javascript">var msg="這是一個跑馬燈效果的javascript文檔"；var interval = 100；var spacelen = 120；

29、var space10="var seq=o； function scrollo len = msgen gth；window.status = msg.substing(o, seq+1)；seq+；if ( seq >= len ) seq = spacelen；window.settimeoutc'scrolo；", interval )；elsewindow.settimeout(,scroll()； interval )；function scroll2() var out"；for (i=1 ； i<=spacelen/space1

30、0ength； i+) out +=spacelo；out = out + msg；len=outen gth； window.status=out.substring(seq, len)； seq+;if ( seq >= len ) seq = 0； ；window.settimeout("scroll2()；", interval )；scrolk)；</script><body></body></html>本講介紹了 javascript腳本是如何加入web頁面，并學(xué)習(xí)了 javascript語言中的基本數(shù)據(jù)類型

31、、變量、常量、操作運(yùn)算符等。從本講中的內(nèi)容中可以看出，對于已經(jīng)掌握c + +語言的人來說，學(xué)>j javascript真是一件非常輕松愉快的事。javascript技術(shù)講座第三講javascript程序構(gòu)成javascript腳本語言的基本構(gòu)成是由控制語句、函數(shù)、對象、方法、屬性等，來實現(xiàn)編程的。一、程序控制流在任何一種語言中，程序控制流杲必須的，它能使得整個程序減小混亂，使之順利按其一定的方式執(zhí)行°下面是javascript常用的程序控制流結(jié)構(gòu)及語句：1、if條件語句基本格式if （表述式）語句段1else語句段2 ；功能：若表達(dá)式為true,則執(zhí)行語句段1 ；否則執(zhí)行語句段

32、2。說明：if -else語句是javascript中最基本的控制語句，通過它可以改變語句的執(zhí)行順序。表達(dá)式中必須使用關(guān)系語句，來實現(xiàn)判斷，它是作為一個布爾值來估算的。它將零和非零的數(shù)分別轉(zhuǎn)化成false和true。若if后的語句有多行，則必須使用花括號將其括起來。if語句的嵌套if （布爾值）語句1 ；else （布爾值）語句2 ；else if （布爾值）語句3 ；else語句4 ；在這種情況下，每一級的布爾表述式都會被計算，若為真，則執(zhí)行其相應(yīng)的語句，否則執(zhí)行else后的語句。2、for循環(huán)語句基本格式for （初始化；條件；增量）語句集；功能：實現(xiàn)條件循環(huán)，當(dāng)條件成立時，執(zhí)行語句集，否

33、則跳出循環(huán)體。說明：初始化參數(shù)告訴循壞的開始位置，必須賦予變量的初值；條件：是用于判別循環(huán)停止時的條件。若條件滿足，則執(zhí)行循環(huán)體，否則 跳出。增量：主要定義循環(huán)控制變量在每次循環(huán)時按什么方式變化。三個主要語句之間，必須使用逗號分隔。3、while 循環(huán)基本格式while （條件）語句集；該語句與for語句一樣，當(dāng)條件為真時，重復(fù)循環(huán)，否則退出循壞。for與while語句兩種語句都是循環(huán)語句，使用for語句在處理有關(guān)數(shù)字時更易看懂，也較緊湊；而while循環(huán)對復(fù)雜的語句效果更特別。4、break 和 continue 語句與c+語言相同，使用break句使得循環(huán)從fo或while中跳出，cont

34、inue使得跳過循壞內(nèi)剩余的涪句 而進(jìn)入下一次循環(huán)。二、函數(shù)函數(shù)為程序設(shè)計人員提供了 一個豐常方便的能力c通常在進(jìn)行一個復(fù)雜的程序設(shè)計時，總是根據(jù)所要完成 的功能，將程序劃分為一些相對獨(dú)立的部分，每部分編寫一個函數(shù)。從而，使各部分充分獨(dú)立，任務(wù)單一, 程序消晰，易懺、易讀、易維護(hù)。javascript函數(shù)可以封裝那些在程序中可能要多次用到的模塊。并可作 為事件驅(qū)動的結(jié)果而調(diào)用的程序。從而實現(xiàn)一個函數(shù)把它與事件驅(qū)動相關(guān)聯(lián)。這是與其它語言不樣的地方。1、javascript函數(shù)定義function函數(shù)名（參數(shù)，變元）函數(shù)體;.return表達(dá)式;說明：艸調(diào)用函數(shù)時，所用變量或字面量均可作為變元傳遞

35、。函數(shù)由關(guān)鍵字function定義。函數(shù)名：定義自己函數(shù)的名字。參數(shù)表，是傳遞給函數(shù)使用或操作的值，其值可以是常量，變量或其它表達(dá)式。通過指定函數(shù)名(實參)來調(diào)用一個函數(shù)。必須使用return將值返回。函數(shù)名對大小耳是敏感的。2、函數(shù)中的形式參數(shù)：在函數(shù)的定義中，我們看到函數(shù)名后有參數(shù)表，這些參數(shù)變量可能是一個或幾個。那么怎樣才能確定參數(shù)變量的個數(shù)呢？在javascript中可通過arguments丄ength來檢查參數(shù)的個數(shù)。例：function function_name(exp1 ,exp2,exp3,exp4)number function _name argumentsength；i

36、f (number>1)docume nt.wrile(exp2)；if (number>2)document. write(exp3)；if(number>3)docume nt.write(exp4)； 三、事件驅(qū)動及事件處理1、基本概念javascript是基于對象(object-based)的語言。這與java不同,java是面向?qū)ο蟮恼Z言。而基于對象的基本特征 就是采用事件驅(qū)動(event-driven),它是在用形界面的環(huán)境下，使得一切輸入變化簡單化。通常鼠標(biāo)或熱鍵的動作我們稱之為事件（event）,而由鼠標(biāo)或熱鍵引發(fā)的一連串程序的動作，稱之為事件驅(qū)動（event

37、 driver）。而對事件進(jìn)行處理程序或函數(shù)，我們稱之為事件處理程序（event handler）。2、事件處理程序在javascript中對象事件的處理通常由函數(shù)（function）擔(dān)任。其基本格式與函數(shù)全部一樣，可以將前面所介紹的所有函數(shù)作為事件處理程序。格式如下：function事件處理名（參數(shù)表）事件處理語句集；3、事件驅(qū)動javascript事件騾動中的事件是通過鼠標(biāo)或熱鍵的動作引發(fā)的。它主要有以下幾個事件：（1 ）單擊事件onclick當(dāng)用戶單擊鼠標(biāo)按鈕時，產(chǎn)生o nclick事件。同時o nclick指定的事件處理程序或代碼將被調(diào)用執(zhí)行。通常在下列基本對象中產(chǎn)生：button （

38、按鈕對象）checkbox （復(fù)選框）或（檢査列表框）radio （單選鈕）reset buttons （重要按鈕）submit buttons （提交按鈕）例：可通過下列按鈕激活changeo文件：<form><lnput type二"button" value二"” onclick="change()"></form>在onclick等號后，可以使用自己編寫的函數(shù)作為事件處理程序，也可以使用javascript中內(nèi)部的函數(shù)。還可以直接使用javascript的代碼等。例：<lnput type=&q

39、uot;button" value=" " onclick=alert("這是一個例子”)；(2) onchange改變事件當(dāng)利用text或texturea元素輸入字符值改變時發(fā)該事件，同時當(dāng)在select表格項中一個選項狀態(tài)改變后也 會引發(fā)該事件。例：<form>vlnput type="text" name="test" value="test" oncharge="check('this.test)"></form>(3) 選中事件

40、onselect當(dāng)text或textarea對象中的文字被加亮后，引發(fā)該事件。(4 )獲得焦點(diǎn)事件onfocus當(dāng)用戶單擊text或textarea以及select對象時，產(chǎn)生該事件"此時該對象成為前臺對象"(5) 失去焦點(diǎn)onblu當(dāng)text對象或textarea對象以及select對象不再擁有焦點(diǎn)、而退到后臺時，引發(fā)該文件，他與onfocas事件是一個對應(yīng)的關(guān)系。(6) 載入文件onload當(dāng)文檔載入時，產(chǎn)生該事件。onload 個作用就是在首次載入一個文檔時檢測cookie的值，并用一個變 量為其賦值，使它可以被源代碼使用。(7)卸載文件onunload當(dāng)web頁面退

41、出時引發(fā)onunload事件，并可更新cookie的狀態(tài)。四、范例范例1 :下例程序是一個自動裝載和自動卸載的例子。即當(dāng)裝入html文檔時調(diào)用loadform()函數(shù)，而退出該文檔進(jìn)入另一html文檔時則首先調(diào)用unloadformo函數(shù),確認(rèn)后方可進(jìn)入。test3_1 .htm<html><head><script language="javascript,><!function loadform()alert("這是一個自動裝載例子!")；function unloadform()alertc這是一個卸載例子!&quo

42、t;)；/></script></head><body onload'loadform()” onunload=,unloadform()l,><a href=,test.htm">調(diào)用v/a></body></html>見圖1所示：microsoft internet explorermicrosoft internet e 這是一個自動裝載例子!確定范例2 ：這是一個獲取瀏覽器版本呂的程序。該程序首先顯示一個波浪一提示信息。之后顯示瀏覽器的版 本號有關(guān)信息。怕 st3_2.htm<h

43、ead><script language= 'javascript"><!一-/ >function makearray(n)thisen gth=n return thisfunction hexfromdec(num) hex二new makearray(1 )；var hexstring=“”；var shifthex=16；var temp1=num；for(x=1 ； x>=0； x-) hexx=math.round(temp1/shifthex 一 .5)；hexx-1 =temp1 - hexx * shifthex；tem

44、pi =hexx-1 ;shifthex /= 16；for (x=1 ； x>=0; x一一) hexstring+=getletter(hexx)； return (hexstring)； function getletter(num) if (num < 10) return num； else if (num = 10) return "a" if (num = 11) return "b" if (num = 12) return "c" if (num = 13) return "d" if

45、 (num = 14) return "e" if (num = 15) return "f" function rainbow(text)var color_d1 ；var allsting="”；for(i=0；i<text. length ；i=i+2)color_d1 =255* math.sin(i/(text.length/3)；color_h1 =hexfromdec(color_d1 )；allstring+=,<font color=,+color_h1+,ff,+color_h1+,>,+text.subs

46、tring(i,i+2)4-,</font>"；return allstring；function sizefont(text) var color_d1 ；var allstring=""；var flag=0；for(i=0,j=0；i<text. length； i=i+1)if (flag=0) j+；if (j>=7) flag=1:if (flag=1) i=j-i ；if (j<=0) flag=o； allstring+="<font size="+ j + ">"

47、+ text.substring(i,i+1) + "</font>"；return allstring；document.write("<font size=8><center>") document. write("<br><br>")document.write( sizefontf'這是一個獲取web瀏覽器的程序") docume ntwiter</centerx/font> jdocument.writec瀏覽器名稱：”+navigat

48、or.appname+ybr>”)；docume nt.writeri-j+navigator.appversion+'ybr”)；document.write代碼名字：，,+navigatorappcodename+,<br>,j；document.write("用戶代理標(biāo)識:"+navigator.useragent)； </script><body></body></html>-nllxi輸出結(jié)果圖2所示。d： javascriptest3 2. htm文件(£)編輯(£)查

49、看(v)轉(zhuǎn)到(q)收藏)幫助qi)地址 ) i© d: jwascriptest3_2. htmexplorer 新聞 internet 開始 internet 起始頁鏈接 ini erne t遲是一個獲耳乂 web瀏 覽粵皓股序瀏覽器名稱：microsoft internet explorer版本號：4.0 (compatible; msie 5. obi; windows 98) 祀碼盤字：_mozilla用戶代理標(biāo)識：mozilla/4. 0 (compatible; msie 5. obi; windows 98)廠廠國我的電腦 本講介紹了 javascript程序設(shè)計的有關(guān)

50、內(nèi)容°程序流、函數(shù)、事件是我們學(xué)習(xí)掌握javascript編程的重點(diǎn)。javascript技術(shù)講座第四講 基于對象的javascript語言javascript語言是基于對象的(object-based),而不是面向?qū)ο蟮?object-oriented)。之 所以說它是一門基于對象的語言，主要是因為它沒有提供象抽象、繼承、重載等有關(guān)面向?qū)ο笳Z言的許多 功能。而是把其它語言所創(chuàng)建的復(fù)雜對象統(tǒng)一起來，從而形成一個非常強(qiáng)大的對象系統(tǒng)。雖然javascript ip,-言是一門基于對象的，但它還是具有一些面向?qū)ο蟮幕咎卣?。它可以根?jù)需要創(chuàng)建自 己的對象，從而進(jìn)一步擴(kuò)大javascript

51、的應(yīng)用范圍，增強(qiáng)編寫功能強(qiáng)大的web文文件。、對象的基礎(chǔ)知識1、對象的基本結(jié)構(gòu)javascript中的對象是由屬性(properties)和方法(methods)兩個基本的元素的構(gòu)成的<=前者是對象在實施 其所需要行為的過程中，實現(xiàn)信息的裝戰(zhàn)單位，從而與變量相關(guān)聯(lián)；后者杲指對象能夠按照設(shè)計者的意圖 而被執(zhí)行，從而與特定的函數(shù)相聯(lián)。2、引用對象的途徑一個對象要真正地被使用，可采用以下幾種方式獲得：引用javascript內(nèi)部對象；由瀏覽器環(huán)境中提供；創(chuàng)建新對象。這就是說一個對象在被引用之前，這個對象必須存在，否則引用將竜無意義，而出現(xiàn)錯謀信息。從上面中 我們可以看出javascript引用

52、對象可通過三種方式獲取。要么創(chuàng)建新的對象，要么利用現(xiàn)存的對象。3、有關(guān)對象操作語句javascript不是一純面向?qū)ο蟮恼Z言，它設(shè)有提供面向?qū)ο笳Z言的許多功能，因此javascript設(shè)計者之所 以把它你“基于對象"而不是面向?qū)ο蟮恼Z言，在javascript中提供了幾個用于操作對象的語句和關(guān)鍵詞及 、zr/r zrar坯算付。1)、for.in 語句格式如下：for (對象屬性名in已知對象名)說明：該語句的功能是用于對已知對象的所有屬性進(jìn)行操作的控制循壞。它是將一個已知對象的所有屬性反復(fù)置 給一個變量；而不是使用計數(shù)器來實現(xiàn)的。該語句的優(yōu)點(diǎn)就是無需知道対象中屈性的個數(shù)即可進(jìn)行操作

53、。例：下列函數(shù)是顯示數(shù)組中的內(nèi)容：function showdata(object)for (var x=0； x<30；x+)document.write(objecti)；該函數(shù)是通過數(shù)組下標(biāo)順序值，來訪問毎個對象的屬性，使用這種方式首先必須知道數(shù)組的下標(biāo)值，否則 若超出范ri,則就會發(fā)生錯誤。而使for.in語句，則根本不需要知道對象屬性的個數(shù)，見下：function showdata(object)for(var prop in object)document.write(objectpop)；使用該函數(shù)時，在循環(huán)體中，for自動將的屬性取出來，直到最后為此。2) 、with 語

54、句使用該諂句的意思是：在該語句體內(nèi)，任何對變量的引用被認(rèn)為是這個對象的屬性，以節(jié)省一些代碼。with object!.所有在with語句后的花括號中的語句，都是在后面object對象的作用域的°3) 、his關(guān)鍵詞this是對當(dāng)前的引用，在javascript由于對象的引用是多層次，多方位的，往往一個對象的引用又需要對 另一個對象的引用，而另一個對象有可能又要引用另一個對象，這樣有可能造成混亂，最后自己已不知道 現(xiàn)在引用的那一個對象，為此javascript提供了一個用于將對象指定當(dāng)前對象的語句this。4) 、ew運(yùn)算符雖然在javascript中對象的功能已經(jīng)是非常強(qiáng)大的了。但更

55、強(qiáng)大的是設(shè)計人員可以按照需求來創(chuàng)建自己的 對象，以滿足某一特定的要求。使用new運(yùn)算符可以創(chuàng)建一個新的對象。其創(chuàng)建對象使用如下格式： newobject=new object(parameters table)；其中newobject創(chuàng)建的新對象：object是已經(jīng)存在的對象；parameters table參數(shù)表；new是javascript 中的命令語句。如創(chuàng)建一個日期新對象newdata=new dataobirthday=new data (december 12.1998)之后就可使newdata、birthday作為一個新的日期對象了。4、對象屬性的引用對象屬性的引用可由下列三種方

56、式之一實現(xiàn)：(1 )使用點(diǎn)()運(yùn)算符university. name二"云南省”university.city=u 昆明市”university.date="1999"其中university是一個已經(jīng)存在的對象，name、city、date是它的三個屬性，并通過操作對其賦值。(2) 通過對象的下標(biāo)實現(xiàn)引用un iversityo=“云南"university! 1 =u 昆明市"university2="1999"通過數(shù)組形式的訪問屬性，可以使用循壞操作獲取其值。function showunievsity(object)

57、for (var j=0；j<2； j+)docume nt.write(objectj)若采用for.in則可以不知其屬性的個數(shù)后就可以實現(xiàn)：function showmy(object)for (var prop in this)docame nt. write(this prop)；(3) 通過字符串的形式實現(xiàn)un iversity"name"="云南"university! "city"="昆明市”university,date,="1999"5. 對象的方法的引用在javascript中對

58、象方法的引用是非常簡單的。objectname.methodso實際上methods()=functionname方法實質(zhì)上是一個函數(shù)。如引用university對象中的showmy ()方法，則可使用：document.write (university.showmy(j)或：document.write(university)如引用math內(nèi)部對象中cos()的方法則：with(math)document.write(cos(35)； docume r)t.write(cos(80)； 若不使用with則引用時相對要復(fù)雜些：document. write(math.cos(35)docume nt.wite(math.si n( 80)二、常用對象的屬性和方法javascript 我們提供了一些非常有用的常用內(nèi)部對象和方法。用戶不需要用腳本來實現(xiàn)這些功能。這正 是基于對象編程的貞正目的。在javascript提供了 string (字符串)、math (數(shù)值計算)和date (日期)三種對象和其它一些相關(guān)的 方法。從而為編程人員快速開發(fā)強(qiáng)大的腳本程序提供了非常有利的條件。1、常用內(nèi)部對象在javascript中對于對象屬性與方法的引用，有兩種情況