JavaScript入門教程初學(xué)者不可多得的優(yōu)秀入門教材教程文件

1、Good is good, but better carries it.精益求精，善益求善。JavaScript入門教程初學(xué)者不可多得的優(yōu)秀入門教材-第1章JavaScript語言入門1為什么學(xué)習(xí)JavaScript提要：Javascript是學(xué)習(xí)腳本語言的首選。她兼容性好，絕大多數(shù)瀏覽器均支持Javascript，而且她功能強(qiáng)大，實(shí)現(xiàn)簡單方便，入門簡單，即使是程序設(shè)計(jì)新手也可以非?？焖偃菀椎厥褂肑avaScript進(jìn)行簡單的編程。Javascript是由Netscape公司創(chuàng)造的一種腳本語言。為便于推廣，被定為javascript，但是javascript與java是兩門不相干的語言，作用也

2、不一樣。作為一門獨(dú)立的編程語言，javascript可以做很多的事情，但它最主流的應(yīng)用還是在Web上創(chuàng)建動態(tài)網(wǎng)頁(即網(wǎng)頁特效)。Javascript在網(wǎng)絡(luò)上應(yīng)用廣泛，幾乎所有的動態(tài)網(wǎng)頁里都能找到它的身影。目前流行的AJAX也是依賴于Javascript而存在的。Javascript與Jscript也不是一門相同的語言，Jscript和vbscript是微軟開發(fā)的兩種腳本語言，微軟，Netscape公司以及其他語言開發(fā)商為減少web開發(fā)者的兼容麻煩，所以成立ECMA，該組織專門制定腳本語言的標(biāo)準(zhǔn)和規(guī)范。ECMA制定的標(biāo)準(zhǔn)腳本語言叫做ECMAScript，Javascript符合ECMA的標(biāo)準(zhǔn)，其

3、實(shí)Javascript也可以叫做ECMAScript.Jscript也ECMA的標(biāo)準(zhǔn)，但用戶較少。vbscript僅局限在微軟的用戶，Netscape不支持。概括地說，JavaScript就是一種基于對象和事件驅(qū)動，并具有安全性能的腳本語言，腳本語言簡單理解就是在客戶端的瀏覽器就可以互動響應(yīng)處理程序的語言，而不需要服務(wù)器的處理和響應(yīng)，當(dāng)然JavaScript也可以做到與服務(wù)器的交互響應(yīng)，而且功能也很強(qiáng)大。而相對的服務(wù)器語言像phpjsp等需要將命令上傳服務(wù)器，由服務(wù)器處理后回傳處理結(jié)果。對象和事件是JavaScript的兩個核心。JavaScript可以被嵌入到HTML文件中，不需要經(jīng)過Web

4、服務(wù)器就可以對用戶操作作出響應(yīng)，使網(wǎng)頁更好地與用戶交互；在利用客戶端個人電腦性能資源的同時，適當(dāng)減小服務(wù)器端的壓力，并減少用戶等待時間。2將JavaScript插入網(wǎng)頁的方法與在網(wǎng)頁中插入CSS的方式相似，使用標(biāo)簽在網(wǎng)頁中插入Javascript代碼。使用下面的代碼可以在網(wǎng)頁中插入JavaScript：.language=javascript表示使用JavaScript腳本語言，腳本語言還有vbscript、jsscript等，如果沒有l(wèi)anguage屬性，表示默認(rèn)使用JavaScript腳本。其中的.就是代碼的內(nèi)容。例如：document.write(我是菜鳥我怕誰!);JavaScript

5、使用document.write來輸出內(nèi)容。將會輸出在網(wǎng)頁上輸出：我是菜鳥我怕誰!學(xué)過編程的人應(yīng)該知道，“我是菜鳥我怕誰!”兩側(cè)雙引號代表字符串的意思。不過不理解這個概念也無所謂，學(xué)到后面就知道什么時候應(yīng)該加雙引號，什么時候不需要加了。有些瀏覽器可能不支持JavaScript，我們可以使用如下的方法對它們隱藏JavaScript代碼。里的內(nèi)容對于不支持JavaScript的瀏覽器來說就等同于一段注釋，而對于支持JavaScript的瀏覽器，這段代碼仍然會執(zhí)行。至于“/”符號則是JavaScript里的注釋符號，在這里添加它是為了防止JavaScript試圖執(zhí)行-。不過通常情況下，現(xiàn)在的瀏覽器幾

6、乎都支持JavaScript，即使是不支持的，也會了解如何合理地處理含有JavaScript的網(wǎng)頁。JavaScript的插入位置不同，效果也會有所不同，還可以像CSS一樣，將JavaScript保存成一個外部文件，這些內(nèi)容會在下一節(jié)討論。3插入JavaScript的位置JavaScript腳本可以放在網(wǎng)頁的head里或者body部分，而且效果也不相同。（1）放在body部分的JavaScript腳本在網(wǎng)頁讀取到該語句的時候就會執(zhí)行，例如：（2）在head部分的腳本在被調(diào)用的時候才會執(zhí)行，例如：.通常是在.定義函數(shù)，通過調(diào)用函數(shù)來執(zhí)行head里的腳本。（3）也可以像添加外部CSS一樣添加外部J

7、avaScript腳本文件，其后綴通常為.js。例如：如果很多網(wǎng)頁都需要包含一段相同的代碼，那么將這些代碼寫入一個外部JavaScript文件是最好的方法。此后，任何一個需要該功能的網(wǎng)頁，只需要引入這個js文件就可以了。注意：腳本文件里頭不能再含有標(biāo)簽。注：放在body里的函數(shù)是一個例外，它并不會被執(zhí)行，而是等被調(diào)用時才會執(zhí)行。關(guān)于函數(shù)與調(diào)用的概念將在后面講到。4JavaScript語句本節(jié)介紹Javasctipt中的語句，語句是編程的一個基本概念。先來看看我們之前例子。例子中的document.write(我是菜鳥我怕誰!);就是一個JavaScript語句，它可以告訴瀏覽器做出一個特定任務(wù)

8、。特別的，這個語句是叫瀏覽器書寫出一段內(nèi)容。我們已經(jīng)知道，document.write的功能是輸出文本，所以上面那個語句就是讓瀏覽器輸出“我是菜鳥我怕誰!”。在JavaScript中，一行的結(jié)束就被認(rèn)定為語句的結(jié)束。但是最好還是要在結(jié)尾加上一個分號“;”來表示語句的結(jié)束。這是一個編程的好習(xí)慣，事實(shí)上在很多語言中句末的分號都是必須的?？纯聪旅孢@個代碼塊document.write(Thisisaheader);document.write(Thisisaparagraph);document.write(Thisisanotherparagraph);5JavaScript注釋HTML、CSS里

9、都有注釋，JavaScript里自然也有注釋，而且分為單行注釋與普通注釋兩種。5.1單行注釋插入單行注釋的符號是“/”/我是注釋，我是注釋document.write(我是菜鳥我怕誰？);5.2多行注釋多行注釋以/*開始，以*/結(jié)束。/*誰說菜鳥不會編程？菜鳥不但會編程還有書寫注釋的良好習(xí)慣*/document.write(我是菜鳥我怕誰？);相信你已經(jīng)了解注釋的作用了。HTML的注釋不會被瀏覽器作為HTML解釋，CSS注釋也不會被瀏覽器解釋。同理，JavaScript的注釋也不會被執(zhí)行。注釋的作用就是記錄自己在編程時候的思路，以便以后自己閱讀代碼時可以馬上找到思路。同樣，注釋也有助于別人閱讀

10、自己書寫的JavaScript代碼?？傊畷鴮懽⑨屖且粋€良好的編程習(xí)慣。6JavaScript變量（1）什么是變量在代數(shù)中，我們會遇到下面的基礎(chǔ)問題，如果a的值為5，b的值為6，那么a與b的和是多少？在這個問題中，我們就可以把a(bǔ)和b看做變量，再設(shè)置一個變量c來保存a與b的和。那么，上面的這個問題就可以用如下的JavaScript代碼表示：/計(jì)算a+b的和a=5;/給變量a賦值b=5;/給變量b賦值c=a+b;/c為a+b的和document.write(c);/輸出c的值執(zhí)行結(jié)果：10在上面的例子中，我們用到了三個變量：a，b，c。這些都是變量的名字，在JavaScript中，我們需要用變量名來

11、訪問這個變量。在JavaScript中，變量名有如下規(guī)定：變量名區(qū)分大小寫，A與a是兩個不同變量。變量名必須以字母或者下劃線開頭。（2）聲明變量我們可以用var聲明變量,比如：vara;/聲明一個變量aa=5;/給變量賦值其實(shí)在第一個例子中我們已經(jīng)看到了，JavaScript中可以不聲明變量直接賦值。不過先聲明變量是一個良好的編程習(xí)慣。（3）給變量賦值來看一個上面出現(xiàn)過的語句：a=5;這個語句怎么讀出來呢？“a等于5”？對不起，不對。應(yīng)該是“讓a等于5”，說得專業(yè)一點(diǎn)，這叫“給a賦值”。我們之前已經(jīng)提到過，a是變量，是可以變的，所以從某種角度來說，它不等于任何值，只是暫時的等于某個值。來看下面

12、這個例子，進(jìn)一步熟悉一下賦值與等于的關(guān)系：a=5;/讓a等于5，a的值暫時等于5a=6;/讓a等于6，a的值暫時等于6再次強(qiáng)調(diào)，如果JavaScript是你學(xué)習(xí)的第一門編程語言，一定要注意區(qū)分“等于”和“賦值”這兩個不同的概念。（4）變量的數(shù)據(jù)類型其實(shí)，在JavaScript中，變量是無所不能的容器，你可以吧任何東西存儲在變量里，例如：varquanNeng1=123;/數(shù)字varquanNeng2=一二三/字符串其中，quanNeng2這個變量存儲了一個字符串，字符串需要用一對引號括起來。變量還可以存儲更多的東西，例如數(shù)組，對象，布爾值等等，我們會在后面介紹這些內(nèi)容。7JavaScript操

13、作符7.1運(yùn)算操作符操作符是用于在JavaScript中指定一定動作的符號，其中算術(shù)操作符主要用來完成類似加減乘除的工作。（1）操作符舉例看下面這段JavaScript代碼。c=a+b;其中的=和+都是操作符。JavaScript中還有很多這樣的操作符，例如，加減乘除是JavaScript中比較基本的幾個操作符，它們的意義與在數(shù)學(xué)中沒有什么差別。JavaScript中最常見的操作符是賦值操作符“=”，上一節(jié)我們已經(jīng)強(qiáng)調(diào)過，它不是等于。（2）操作符的優(yōu)先級我們都知道，在數(shù)學(xué)中，“a+b*c”這個式子中，乘法將先于加法運(yùn)算。同樣，在JavaScript中，這個式子會按相同的順序執(zhí)行。我們稱之為“優(yōu)

14、先級”，即“*”的優(yōu)先級高于“+”。與數(shù)學(xué)中一樣，改變運(yùn)算順序的方法是添加括號，JavaScript中改變優(yōu)先級的方法也是添加括號。例如：(a+)*c（3）字符串的連接在JavaScript中，“+”不知代表加法，同樣也可以使用它來諒解兩個字符串，例如：example=烏+龜;在上面的例子中，example將包含“烏龜”這個字符串。這是由于“+”完成了“烏”和“龜”的連接，當(dāng)然了，你也可以把這種行為理解成字符串的加法。（4）自加一，自減一操作符這里我們來看兩個非常常用的運(yùn)算符，自加一“+”；自減一“-”。首先來看一個例子：a=5;a+;/a的值變?yōu)?a-/a的值有變回5上面的例子中，a+使得a

15、的值在原來的基礎(chǔ)上增加1，a-則讓a在現(xiàn)在的基礎(chǔ)上在減去1。所以，其實(shí)“a+”也可以寫成“a=a+1”;/等同于a+（5）復(fù)合操作符延續(xù)上面的例子，其實(shí)“a=a+1”還可以寫成：a+=1;/將a的值加1之后再賦給a這樣把運(yùn)算和賦值結(jié)合到一起的操作符叫做復(fù)合操作符。上面我們看到的是加法與賦值的結(jié)合，JavaScript中還有其它的符合運(yùn)算符：a+=b;/a=a+ba-=b;/a=a-ba*=b;/a=a*ba/=b;/a=a/b7.2比較操作符和邏輯操作符操作符是用于在JavaScript中指定一定動作的符號。（1）比較操作符比如：“=”符號，它是一個比較操作符，它表示的意思就是“相等嗎？”。例

16、如：a=b表示：“a與b的值相等嗎？”在JavaScript中，這樣的比較操作符有很多，下面就列出這些操作符以及它們的含義?！啊盿大于b嗎？“=”a大于等于b嗎？“b”在JavaScript中還表示為ab；數(shù)學(xué)中的“b大于a，b小于c”是“aba&你可能已經(jīng)猜到了，“&”是而且的意思。if(條件1&條件2)/代碼只有條件1、2同時滿足，代碼才會得到執(zhí)行。類似的操作符還有“或者(|)”和“非(!)”if(條件1|條件2)/代碼“|”表示或者的意思，只要條件1或2中有一個滿足，代碼就會得到執(zhí)行。if(!條件)/代碼“！”表示非，也就是不是的意思，只有條件不滿足的時候，代碼才會得到執(zhí)行。8JavaS

17、cript流程控制語句8.1ifelse語句（如果，否則）ifelse是所有編程語言里都有的功能，它使得程序具有簡單的判斷能力。在介紹if之前，讓我們先來了解一下布爾值這個概念。(1)布爾(Bool)值在變量一節(jié)中，我們曾經(jīng)說過，變量可以用來存儲布爾值。哪么布爾值的作用究竟是什么呢？簡單的說，布爾值的作用就是用來表示“真的假的”。所以布爾值其實(shí)只有兩種取值：真(true)和假(false)。(2)ifelse結(jié)構(gòu)其實(shí)“ifelse”的意思和字面意思是一樣的，就是“如果”、“否則”。還是讓我們來看一個使用if的例子吧。Varhobby=“VbScript”;if(hobby=“JavaScrip

18、t”)document.write(有發(fā)展);我們來解釋一下這段代碼。首先是一個“if”，它后面緊跟著一個括號，括號里則是一個條件，確切地說是一個布爾值。當(dāng)條件成立的時候，這個值是true，“”里的語句將會得到執(zhí)行；否則這個值是flase，“”里的語句將被忽略。具體到我們的例子，因?yàn)閔obby變量的值是“VbScript”，所以不做回答。如果hobby變量的值是“JavaScript”，則回答“有發(fā)展”。注意“=”這個符號，這個符號用來判斷左右兩邊是否相等。下一節(jié)會詳細(xì)地介紹。如果你的愛好不是JavaScript，那么沒有任何輸出。如果你希望它能對這種情況做出反應(yīng)，我們可以請else來幫忙，看

19、下面的代碼：varhobby=JavaScriptif(hobby=JavaScript)document.write(有發(fā)展);else/如果愛好不是JavaScriptdocument.write(沒有評價(jià));上面的代碼用到了“else”，它會給if添加一種“否則”的狀態(tài)。當(dāng)hobby不是“JavaScript”的時候，它會表明“沒有評價(jià)”。（3）ifelse嵌套如果想做更多的判斷，可以用if的嵌套,看下面的代碼。varhobby=JavaScriptif(hobby=JavaScript)document.write(有發(fā)展);elseif(hobby=football)/如果愛好是足球

20、。/注意：這個if是嵌套在上一個ifelse中的else中的document.write(我X);else/既不是JavaScript又不是足球document.write(沒有評價(jià));第二個if只有在第一個if的條件不成立的時候才有機(jī)會執(zhí)行。8.2JavaScriptSwitch語句當(dāng)有很多種選項(xiàng)的時候，switch比ifelse使用更方便。上一節(jié)我們已經(jīng)看到，利用ifelse可以讓程序具有基本的判斷能力，而使用嵌套的ifelse則可以讓程序?qū)Χ喾N情況進(jìn)行判斷。但是當(dāng)情況的種類比較多的時候，使用switch語句將更加合適。比如要實(shí)現(xiàn)如下功能的程序：輸入一個學(xué)生的考試成績，我們按照每十分一個等

21、級將成績分等，程序?qū)⒏鶕?jù)成績的等級做出不同的評價(jià)。很明顯，用ifelse可以實(shí)現(xiàn)這樣的程序，但是代碼會很復(fù)雜。而如果使用switch語句，代碼則會簡單一些，首先來看一下思路，再把它翻譯成JavaScript。思路：將分?jǐn)?shù)轉(zhuǎn)化為特定等級以便于switch處理。判斷分?jǐn)?shù)屬于哪種等級。根據(jù)分?jǐn)?shù)等級做出評價(jià)：例如低于60給出掛科評價(jià)。翻譯成JavaScript就是如下代碼(注意注釋)：/首先，我們用score變量來存儲分?jǐn)?shù)，假設(shè)為65varscore=65;/用分?jǐn)?shù)除以10，parseInt的作用是把它轉(zhuǎn)換為整數(shù)，/暫時不用深究，()內(nèi)最后的結(jié)果為6switch(parseInt(score/10)/

22、switch開始實(shí)現(xiàn)判斷過程，case6得到滿足case0:case1:case2:case3:case4:case5:/根據(jù)不同的等級做出不同的行為。/冒號后面的語句就是行為/case0到5的行為都是下面這個語句degree=恭喜你，又掛了！;break;case6:degree=勉強(qiáng)及格;break;case7:degree=湊合，湊合break;case8:degree=不錯，不錯;break;case9:case10:degree=高手高手，佩服佩服;/endofswitch記得在每個case所執(zhí)行的語句里添加上一個break語句。為了理解break的作用，我們來看看如果沒有break

23、會怎么樣：switch(parseInt(score/10)case0:case1:case2:case3:case4:case5:degree=恭喜你，又掛了！;case6:degree=勉強(qiáng)及格;case7:degree=湊合，湊合case8:degree=8錯，8錯;case9:case10:degree=高手高手，佩服佩服;/endofswitch在上面的代碼中，如果成績是50分，那么score/10就是5，則case5后面的語句將會得到執(zhí)行，同樣，case6、7等等后面的語句都會得到執(zhí)行。也就是說，我們會得到：”恭喜你，又掛了！勉強(qiáng)及格湊合，湊合8錯，8錯高手高手，佩服佩服“這樣沒有

24、意義的評價(jià)。這就是swtitch語句的執(zhí)行邏輯，當(dāng)發(fā)現(xiàn)某個case滿足后，該switch中在該case后的所有語句都會得到執(zhí)行。第一個例子中的break就是為了讓switch”停下來“。8.3JavaScriptFor循環(huán)所謂循環(huán)，就是重復(fù)執(zhí)行一段代碼。前面我們已經(jīng)看到了，ifelse和switch是JavaScript具有了判斷的能力，但是電腦的判斷能力和人比起來差遠(yuǎn)了。電腦更擅長一件事情不停地重復(fù)。我們在JavaScript中把這叫做循環(huán)。for語句結(jié)構(gòu)如下：for(初始條件;判斷條件;循環(huán)后動作)循環(huán)代碼讓我們來看一個簡單的例子吧：有十個菜鳥報(bào)數(shù)，“菜鳥1號、菜鳥2號”。有了for循環(huán)，

25、很少的代碼就可以實(shí)現(xiàn)十個菜鳥的報(bào)數(shù)。vari=1;for(i=1;i=10;i+)document.write(菜鳥+i+號);結(jié)果如下：菜鳥1號菜鳥2號菜鳥3號菜鳥4號菜鳥5號菜鳥6號菜鳥7號菜鳥8號菜鳥9號菜鳥10號在上面那個例子中，循環(huán)恰好執(zhí)行了10次，那么和“for(i=1;i=10;i+)”一句中的10是不是10次的意思呢？下面我們就來看看for循環(huán)的工作機(jī)制。首先i=1叫做初始條件，也就是說從哪里開始，特別的，我們的例子從i=1開始。出現(xiàn)在第一個分號后面的i=10表示判斷條件，每次循環(huán)都會先判斷這個條件是否滿足，如果滿足則繼續(xù)循環(huán)，否則停止循環(huán)，繼續(xù)執(zhí)行for循環(huán)后面的代碼。你可能

26、想問了，我們設(shè)定了i=0，豈不是永遠(yuǎn)都小于等于10嗎？來看第三個部分。最后的i+表示讓i在自身的基礎(chǔ)上加1，這時每次循環(huán)后的動作.也就是說，每次循環(huán)結(jié)束，i都會比原來大1，執(zhí)行若干次循環(huán)之后，i=10的條件就不滿足了，這時循環(huán)結(jié)束。for循環(huán)后面的代碼將得到執(zhí)行。8.4JavaScriptWhile循環(huán)while循環(huán)重復(fù)執(zhí)行一段代碼，直到某個條件不再滿足。（1）while循環(huán)的結(jié)構(gòu)：while(判斷條件)循環(huán)代碼其實(shí)while循環(huán)和for循環(huán)的作用都是重復(fù)執(zhí)行代碼，例如下面這段代碼，和上一節(jié)for循環(huán)的輸出結(jié)果完全沒有區(qū)別。先來讀讀例子的代碼，下面會解釋為什么這個循環(huán)會和上一節(jié)的for循環(huán)等價(jià)

27、。vari=0;while(i=10)document.write(菜鳥+i+號);document.write();i=i+1;看起來好像比for循環(huán)少了點(diǎn)東西啊，只有一個判斷條件啊。其實(shí)這個循環(huán)也是有初始條件的，只不過在之前就已經(jīng)定義好了，例如上面例子中的vari=0;，至于變量i的增大，則是放到了循環(huán)體里面，其實(shí)這個過程和for沒有什么區(qū)別，也是變量i不斷變大，直到判斷條件不滿足，則循環(huán)結(jié)束。（2）dowhile循環(huán)的結(jié)構(gòu)dowile結(jié)構(gòu)的基本原理和while結(jié)構(gòu)是基本相同的，但是它保證循環(huán)體至少被執(zhí)行一次。因?yàn)樗窍葓?zhí)行代碼，后判斷條件。例子如下：i=0;dodocument.writ

28、e(Thenumberis+i);document.write();i+;while(i=5)8.5JavaScriptBreak與ContinueBreak可以跳出循環(huán)，Continue跳過本次循環(huán)。（1）breakbreak語句可以讓循環(huán)中途停止，直接執(zhí)行后面的代碼。格式如下：while(i10)if(特殊情況)break;循環(huán)代碼那么，當(dāng)特殊情況發(fā)生的時候，循環(huán)就會立即結(jié)束。看看下面的例子，我們的菜鳥7號到10號在寢室打游戲vari=0;for(i=0;i=10;i+)if(i=6)break;/如果i是6的話就退出循環(huán)。document.write(菜鳥+i+號);當(dāng)i=7的時候循環(huán)就

29、會結(jié)束，不會輸出后面循環(huán)的內(nèi)容。（2）continuecontinue的作用是僅僅跳過本次循環(huán)，而整個循環(huán)體繼續(xù)執(zhí)行。它的格式如下：while(判斷條件)if(特殊情況)continue;循環(huán)代碼上面的循環(huán)中，當(dāng)特殊情況發(fā)生的時候，本次循環(huán)將被跳過，而后續(xù)的循環(huán)則不會受到影響，來看看下面的例子：菜鳥6號外出學(xué)習(xí)JavaScript去了。vari=0for(i=0;i=10;i+)if(i=3)continue;document.write(Thenumberis+i);document.write();上面的代碼中，i=6的那次循環(huán)將被跳過.8.6JavaScriptFor.In循環(huán)Javas

30、cript中的forin循環(huán)通常用來遍歷數(shù)組首先要了解什么是數(shù)組，所謂數(shù)組，其實(shí)就是一個保存了一組類似變量的一個集合。我們來看一個保存了愛好的數(shù)組實(shí)例：varx;varhobbies=newArray();/創(chuàng)建一個新的數(shù)組hobbies0=JavaScript;hobbies1=CSS;hobbies2=籃球;for(xinhobbies)/數(shù)組中的每一個變量document.write(hobbiesx+);輸出結(jié)果如下：JavaScriptCSS籃球我們來分析一下上面的例子：varhobbies=newArray();一句創(chuàng)建了一個新的數(shù)組。hobbies0=JavaScript;以及之

31、后的兩句則是給hobbies數(shù)組賦值。這與我們之前見過的變量賦值不太一樣，hobbies后面多出一個0，這個是變量的索引。我們之前已經(jīng)說了，數(shù)組是變量的集合，因此我們在賦值之前需要指明給數(shù)組中的哪一個變量賦值。在這里，0表示的是hobbies數(shù)組所包含的第一個變量，沒錯，數(shù)組的索引是從0開始的，開始可能有點(diǎn)別扭，慢慢就習(xí)慣了。最后的forin循環(huán)就很好理解了，for(xinhobbies)/數(shù)組中的每一個變量document.write(hobbiesx+);表示遍歷hobbies數(shù)組的所有變量，并且將他們逐一輸出。9JavaScript彈出框JavaScript中有三種彈出框:警告(aler

32、t)、確認(rèn)(confirm)以及提問(prompt)。9.1警告(alert)在訪問網(wǎng)站的時候，你遇到過這樣的情況嗎？“咚”的一聲，一個小窗口出現(xiàn)在你面前，上面寫著一段警示性的文字，或是其它的提示信息。如果你不點(diǎn)擊確定，你就不能對網(wǎng)頁做任何的操作。沒錯，這個“咚”的小窗口就是alert干的。下面的代碼是一段使用alert的實(shí)例。alert(我是菜鳥我怕誰);9.2確認(rèn)(confirm)確認(rèn)框用于讓用戶選擇某一個問題是否符合實(shí)際情況。來看下面的代碼：我們用confirm(你是菜鳥嗎？)向訪客提問，變量r則保存了訪客的回應(yīng)，它只可能有兩種取值：true或false。沒錯，它是一個布爾值。confi

33、rm后面的語句則是我們對訪客回答做出的不同回應(yīng)。varr=confirm(你是菜鳥嗎);if(r=true)document.write(彼此彼此);elsedocument.write(佩服佩服);9.3提問(prompt)prompt和confirm類似，不過它允許訪客隨意輸入回答。我們來修改一下之前switch的例子，我們根據(jù)分?jǐn)?shù)來做出不同的評價(jià)，不過那段程序并不完整，它根本就沒問我們分?jǐn)?shù)，而是假設(shè)我得了65分。這太不公平了?，F(xiàn)在我么就可以用prompt來向訪客提問，用score存儲用戶輸入的回答，其余的事情就都由后面的switch來完成了。functionjudge()varscore

34、;/分?jǐn)?shù)vardegree;/分?jǐn)?shù)等級score=prompt(你的分?jǐn)?shù)是多少？)if(score100)degree=耍我？100分滿！;elseswitch(parseInt(score/10)case0:case1:case2:case3:case4:case5:degree=恭喜你，又掛了！;break;case6:degree=勉強(qiáng)及格;break;case7:degree=湊合，湊合break;case8:degree=8錯，8錯;break;case9:case10:degree=高手高手，佩服佩服;/endofswitch/endofelsealert(degree);prom

35、pt()方法除了可以給出提示信息外，還可以給出初始值，格式如下：prompt(“提示信息”，“初值”)10JavaScript函數(shù)通常情況下，函數(shù)是完成特定功能的一段代碼。把一段完成特定功能的代碼塊放到一個函數(shù)里，以后就可以調(diào)用這個函數(shù)啦，這樣就省去了重復(fù)輸入大量代碼的麻煩。還記得我們上一節(jié)所使用的alert嗎？其實(shí)它就是一個函數(shù)，他是JavaScript提供的函數(shù)。一個函數(shù)的作用就是完成一項(xiàng)特定的任務(wù)。如果沒有函數(shù)時，完成一項(xiàng)任務(wù)可能需要五行、十行、甚至更多的代碼。每次需要完成這個任務(wù)的時候都重寫一遍代碼顯然不是一個好主意。這是我們就可以編寫一個函數(shù)來完成這個任務(wù)，以后只要調(diào)用這個函數(shù)就可以

36、了。10.1定義一個函數(shù)說了這么多，那么究竟如何定義一個函數(shù)呢？看看下面的格式：function函數(shù)名()函數(shù)代碼;函數(shù)由關(guān)鍵字Function定義，把“函數(shù)名”替換為你想要的名字，把“代碼”替換為完成特定功能的代碼，函數(shù)就定義好了。了解了如何定義函數(shù)，我們就來自己編寫一個實(shí)現(xiàn)兩數(shù)相加的簡單函數(shù)吧。首先給函數(shù)起一個有意義的名字：“add2”，它的代碼如下：functionadd2()sum=1+1;alert(sum);10.2函數(shù)的調(diào)用函數(shù)定義好了，如何調(diào)用呢？其實(shí)可以通過很多種方法調(diào)用上面的函數(shù)，我們這里使用最簡單的函數(shù)調(diào)用方式按鈕的點(diǎn)擊事件，JavaScript事件會在后面介紹。試著點(diǎn)擊

37、下面的按鈕調(diào)用定義好的函數(shù)：functionadd2()sum=1+1;alert(sum);通過button按鈕的鼠標(biāo)單擊事件onclick調(diào)用add2()函數(shù)。10.3帶參數(shù)的函數(shù)上述Add2()函數(shù)不能實(shí)現(xiàn)任意指定兩數(shù)相加。其實(shí)，函數(shù)的定義可以是下面的格式：function(參數(shù)1,參數(shù)2,參數(shù)3)部分函數(shù)代碼按照這個格式，我們的函數(shù)應(yīng)該寫成：functionadd2(x,y)sum=x+y;alert(sum);x和y則是我們函數(shù)的兩個參數(shù)，調(diào)用函數(shù)的時候，我們就可以通過這兩個參數(shù)把兩個加數(shù)傳遞給函數(shù)了。例如，add2(3，4)會求3+4的和，add2(56,65)則會求出56和65的

38、和?！霸俚鹊?！這函數(shù)沒有用啊，這里只是把結(jié)果alert出來，我想對結(jié)果做些處理怎么辦??？”10.4帶返回值的函數(shù)好吧，我們把a(bǔ)lert(sum)一行改成下面的代碼：returnsum;return后面的值叫做返回值。使用下面的語句調(diào)用函數(shù)就可以將這個返回值存儲在變量中了。result=add2(3,4);該語句執(zhí)行后，result變量中的值為7。值得說明的是，我們的函數(shù)中，參數(shù)和返回值都是數(shù)字，其實(shí)它們也可以是字符串等其它類型。11JavaScript事件我們之前提到過函數(shù)的調(diào)用。函數(shù)定義之后，默認(rèn)是不會執(zhí)行的，這時候就需要一些事件來觸發(fā)這個函數(shù)的執(zhí)行。JavaScript很多有很多事件，例如

39、鼠標(biāo)的點(diǎn)擊、移動，網(wǎng)頁的載入和關(guān)閉。我們先來定義一個函數(shù)，再看幾個事件的實(shí)例。統(tǒng)一的示例函數(shù)：functiondisplaymessage()alert(我是菜鳥我怕誰!);函數(shù)的事件很簡單，只是顯示一條消息。11.1點(diǎn)擊事件使用點(diǎn)擊事件調(diào)用，需要給元素設(shè)置onclick屬性。示例代碼如下：onclick調(diào)用函數(shù)由于設(shè)置了onclick=displaymessage()，因此點(diǎn)擊按鈕則會調(diào)用函數(shù)。窗體頂端11.2鼠標(biāo)經(jīng)過、移出事件使用鼠標(biāo)經(jīng)過事件調(diào)用函數(shù)的代碼如下：鼠標(biāo)滑過調(diào)用函數(shù)當(dāng)鼠標(biāo)經(jīng)過按鈕時，觸發(fā)onmouseover事件，將會調(diào)用函數(shù)displaymessage()。使用鼠標(biāo)移出事件調(diào)

40、用函數(shù)的代碼如下：鼠標(biāo)移出調(diào)用函數(shù)把鼠標(biāo)移動到這個按鈕里面，當(dāng)再移動出去時，觸發(fā)onmouseout事件，將會調(diào)用函數(shù)displaymessage()。11.3更多事件JavaScript中還有很多事件，完整的列表可以看看/learn/view/p/3/o/0/doc/jsref_events/。下面的列表列舉了可以插入HTML標(biāo)簽中來定義事件動作的屬性，具體的用法請參考上面的網(wǎng)站。屬性事件發(fā)生時機(jī)onabort圖片下載被打斷時onblur元素失去焦點(diǎn)時onchange框內(nèi)容改變時onclick鼠標(biāo)點(diǎn)擊一個對象時ondblclick鼠標(biāo)雙擊一個對象時onerror當(dāng)加載文檔或圖片時發(fā)生錯誤時o

41、nfocus當(dāng)元素獲取焦點(diǎn)時onkeydown按下鍵盤按鍵時onkeypress按下或按住鍵盤按鍵時onkeyup放開鍵盤按鍵時onload頁面或圖片加載完成時onmousedown鼠標(biāo)被按下時onmousemove鼠標(biāo)被移動時onmouseout鼠標(biāo)離開元素時onmouseover鼠標(biāo)經(jīng)過元素時onmouseup釋放鼠標(biāo)按鍵時onreset重新點(diǎn)擊鼠標(biāo)按鍵時onresize當(dāng)窗口或框架被重新定義尺寸時onselect文本被選擇時onsubmit點(diǎn)擊提交按鈕時onunload用戶離開頁面時12JavaScript特殊字符JavaScript中有一些特殊的字符，如果想要在字符串中使用，需要加上一

42、個反斜線。我們在之前已經(jīng)看過好多應(yīng)用字符串的例子，如果現(xiàn)在想輸出內(nèi)容將是：小明說：我是菜鳥我怕誰？。該怎么辦呢？雙引號被當(dāng)作javascript標(biāo)記字符串開始和結(jié)束的符號，我們怎么能在字符串里引入雙引號呢?看看下面這個例子。document.write(小明說：我是菜鳥我怕誰？。);我們在雙引號前面加上一個反斜線就可以了。在JavaScript中有很多這樣具有功能的特殊字符，如果需要把它們插入字符串都需要在前面加上一個反斜線。特殊字符列表JavaScript特殊字符代碼代碼輸出單引號雙引號&與符號反斜線n換行r回車t制表符b后退f走紙換頁13JavaScript指導(dǎo)準(zhǔn)則（1）在書寫JavaSc

43、ript的過程中，應(yīng)該記住它是區(qū)分大小寫的，變量名和函數(shù)名都區(qū)分大小寫。比如：VarA=1;Vara=2;A和a是兩個不同的變量。（2）代碼中多余的空格是被忽略的。例如下面兩個語句a=b+c;a=b+c;他們是等價(jià)的。（3）”表示本行未完前面已經(jīng)說過，瀏覽器讀到一行末尾會自動判定本行已經(jīng)結(jié)束，不過我們可以通過在行末添加一個“”來告訴瀏覽器本行沒有結(jié)束。document.write(HelloWorld!)和document.write(我是菜鳥我怕誰!)是完全一樣的。14JavaScript對象化編程JavaScript是使用“對象化編程”的，或者叫“面向?qū)ο缶幊獭钡?。所謂“對象化編程”，意思

44、是把JavaScript能涉及的范圍劃分成大大小小的對象，對象下面還繼續(xù)劃分對象直至非常詳細(xì)為止，所有的編程都以對象為出發(fā)點(diǎn)，基于對象。小到一個變量，大到網(wǎng)頁文檔、窗口甚至屏幕，都是對象。JavaScript對象是可以是一段文字、一幅圖片、一個表單（Form）等等。每個對象有它自己的屬性、方法和事件。對象的屬性是反映該對象某些特定的性質(zhì)的，例如：字符串的長度、圖像的長寬、文字框（Textbox）里的文字等等；對象的方法能對該對象做一些事情，例如，表單的“提交”(Submit)，窗口的“滾動”(Scrolling)等等；而對象的事件就能響應(yīng)發(fā)生在對象上的事情，例如提交表單產(chǎn)生表單的“提交事件”，

45、點(diǎn)擊連接產(chǎn)生的“點(diǎn)擊事件”。不是所有的對象都有以上三個性質(zhì)，有些沒有事件，有些只有屬性。引用對象的任一“性質(zhì)”用“.”這種方法。JavaScript對象有：基本對象、全局對象、文檔對象。下面我們一一介紹。14.1基本對象（1）String字符串對象我們在之前的學(xué)習(xí)中已經(jīng)就在使用字符串對象對象了，聲明一個字符串對象的方法就是直接賦值。比如：vars=我有個7個字符;定義了s這個字符串之后，我們就有了一個字符串對象，我們可以訪問它的屬性，使用它的方法。屬性length用法：.length；返回該字符串的長度。方法charAt()用法：.charAt()；返回該字符串位于第位的單個字符。注意：字符串

46、中的一個字符是第0位的，第二個才是第1位的，最后一個字符是第length-1位的。charCodeAt()用法：.charCodeAt()；返回該字符串位于第位的單個字符的ASCII碼。fromCharCode()用法：String.fromCharCode(a,b,c.)；返回一個字符串，該字符串每個字符的ASCII碼由a,b,c.等來確定。indexOf()用法：.indexOf(,)；該方法從中查找（如果給出就忽略之前的位置），如果找到了，就返回它的位置，沒有找到就返回“-1”。所有的“位置”都是從零開始的。lastIndexOf()用法：.lastIndexOf(,)；跟indexOf

47、()相似，不過是從后邊開始找。split()用法：.split()；返回一個數(shù)組，該數(shù)組是從中分離開來的，決定了分離的地方，它本身不會包含在所返回的數(shù)組中。例如：1&2&345&678.split(&)返回?cái)?shù)組：1,2,345,678。關(guān)于數(shù)組，我們等一下就討論。substring()用法：.substring(,)；返回原字符串的子字符串，該字符串是原字符串從位置到位置的前一位置的一段。-=返回字符串的長度（length）。如果沒有指定或指定得超過字符串長度，則子字符串從位置一直取到原字符串尾。如果所指定的位置不能返回字符串，則返回空字符串。substr()用法：.substr(,)；返回原

48、字符串的子字符串，該字符串是原字符串從位置開始，長度為的一段。如果沒有指定或指定得超過字符串長度，則子字符串從位置一直取到原字符串尾。如果所指定的位置不能返回字符串，則返回空字符串。toLowerCase()用法：.toLowerCase()；返回把原字符串所有大寫字母都變成小寫的字符串。toUpperCase()用法：.toUpperCase()；返回把原字符串所有小寫字母都變成大寫的字符串。（2）Array數(shù)組對象數(shù)組對象是一個對象的集合，里邊的對象可以是不同類型的。數(shù)組的每一個成員對象都有一個“下標(biāo)”，用來表示它在數(shù)組中的位置，是從零開始的。數(shù)組的定義方法：var=newArray();

49、這樣就定義了一個空數(shù)組。以后要添加數(shù)組元素，就用：=.;數(shù)組的下標(biāo)用方括號括起來。如果想在定義數(shù)組的時候直接初始化數(shù)據(jù)，請用：var=newArray(,.);例如：varmyArray=newArray(1,4.5,Hi);定義了一個數(shù)組myArray，里邊的元素是：myArray0=1;myArray1=4.5;myArray2=Hi。定義時指定有n個空元素的數(shù)組，請用：vara=newArray(n);屬性length用法：.length；返回：數(shù)組的長度，即數(shù)組里有多少個元素。它等于數(shù)組里最后一個元素的下標(biāo)加一。方法join()用法：.join()；返回一個字符串，該字符串把數(shù)組中的各

50、個元素串起來，用置于元素與元素之間。這個方法不影響數(shù)組原本的內(nèi)容。reverse()用法：.reverse()；使數(shù)組中的元素順序反過來。如果對數(shù)組1,2,3使用這個方法，它將使數(shù)組變成：3,2,1。slice()用法：.slice(,)；返回一個數(shù)組，該數(shù)組是原數(shù)組的子集，始于，終于。如果不給出，則子集一直取到原數(shù)組的結(jié)尾。sort()用法：.sort()；使數(shù)組中的元素按照一定的順序排列。如果不指定，則按字母順序排列。在這種情況下，80是比9排得前的。如果指定，則按所指定的排序方法排序。比較難講述，這里只將一些有用的介紹給大家。按升序排列數(shù)字：functionsortMethod(a,b)

51、returna-b;myArray.sort(sortMethod);按降序排列數(shù)字：把上面的“a-b”該成“b-a”。（3）Math“數(shù)學(xué)”對象Math對象，提供對數(shù)據(jù)的數(shù)學(xué)計(jì)算。下面所提到的屬性和方法，不再詳細(xì)說明“用法”，大家在使用的時候記住用“Math.”這種格式。屬性E返回常數(shù)e(2.718281828.)。LN2返回2的自然對數(shù)(ln2)。LN10返回10的自然對數(shù)(ln10)。LOG2E返回以2為低的e的對數(shù)(log2e)。LOG10E返回以10為低的e的對數(shù)(log10e)。PI返回（3.1415926535.)。SQRT1_2返回1/2的平方根。SQRT2返回2的平方根。方法

52、abs(x)返回x的絕對值。acos(x)返回x的反余弦值（余弦值等于x的角度），用弧度表示。asin(x)返回x的反正弦值。atan(x)返回x的反正切值。atan2(x,y)返回復(fù)平面內(nèi)點(diǎn)(x,y)對應(yīng)的復(fù)數(shù)的幅角，用弧度表示，其值在-到之間。ceil(x)返回大于等于x的最小整數(shù)。cos(x)返回x的余弦。exp(x)返回e的x次冪(ex)。floor(x)返回小于等于x的最大整數(shù)。log(x)返回x的自然對數(shù)(lnx)。max(a,b)返回a,b中較大的數(shù)。min(a,b)返回a,b中較小的數(shù)。pow(n,m)返回n的m次冪(nm)。random()返回大于0小于1的一個隨機(jī)數(shù)。rou

53、nd(x)返回x四舍五入后的值。sin(x)返回x的正弦。sqrt(x)返回x的平方根。tan(x)返回x的正切。（4）Date對象Date日期對象。這個對象可以儲存任意一個日期，從0001年到9999年，并且可以精確到毫秒數(shù)（1/1000秒）。定義一個日期對象：vartoday=newDate();這個方法使d成為日期對象，并且已有初始值：當(dāng)前時間。如果要自定初始值，可以用下列方法：vard=newDate(99,10,1);/99年10月1日vard=newDate(Oct1,1999);/99年10月1日最好的方法就是用下面介紹的“方法”來嚴(yán)格的定義時間。方法以下有很多getXXX()、

54、setXXX（）這樣的方法，getXXX()是獲得某個數(shù)值，而setXXX（）是設(shè)定某個數(shù)值。如無說明，方法的使用格式為：“.”，下同。get/setFullYear()返回/設(shè)置年份，用四位數(shù)表示。如果使用“x.setFullYear(99)”，則年份被設(shè)定為0099年。get/setYear()返回/設(shè)置年份，用兩位數(shù)表示。設(shè)定的時候?yàn)g覽器自動加上“19”開頭，故使用“x.setYear(00)”把年份設(shè)定為1900年。get/setMonth()返回/設(shè)置月份,0表示1月。get/setDate()返回/設(shè)置日期。get/setDay()返回/設(shè)置星期，0表示星期天。get/setHou

55、rs()返回/設(shè)置小時數(shù)，24小時制。get/setMinutes()返回/設(shè)置分鐘數(shù)。get/setSeconds()返回/設(shè)置秒鐘數(shù)。get/setMilliseconds()返回/設(shè)置毫秒數(shù)。get/setTime()返回/設(shè)置時間，該時間就是日期對象的內(nèi)部處理方法：從1970年1月1日零時正開始計(jì)算到日期對象所指的日期的毫秒數(shù)。如果要使某日期對象所指的時間推遲1小時，就用：“x.setTime(x.getTime()+60*60*1000);”（一小時60分，一分60秒，一秒1000毫秒）。getTimezoneOffset()返回日期對象采用的時區(qū)與格林威治時間所差的分鐘數(shù)。在格林威

56、治東方的市區(qū)，該值為負(fù)，例如：中國時區(qū)（GMT+0800）返回“-480”。toString()返回一個字符串，描述日期對象所指的日期。這個字符串的格式類似于：“FriJul2115:43:46UTC+08002000”。toLocaleString()返回一個字符串，描述日期對象所指的日期，用本地時間表示格式。如：“2000-07-2115:43:46”。toGMTString()返回一個字符串，描述日期對象所指的日期，用GMT格式。toUTCString()返回一個字符串，描述日期對象所指的日期，用UTC格式。parse()用法：Date.parse()；返回該日期對象的內(nèi)部表達(dá)方式。下面

57、例子顯示當(dāng)前日期：today=newDate();varday;vardate;if(today.getDay()=0)day=星期日if(today.getDay()=1)day=星期一if(today.getDay()=2)day=星期二if(today.getDay()=3)day=星期三if(today.getDay()=4)day=星期四if(today.getDay()=5)day=星期五if(today.getDay()=6)day=星期六date=今天是+(today.getYear()+年+(today.getMonth()+1)+月+today.getDate()+日+da

58、y+;document.write(date);14.2全局對象全局對象就是一些全局函數(shù)，他們可以直接用，這里對它們進(jìn)行簡要的介紹。eval()把括號內(nèi)的字符串當(dāng)作標(biāo)準(zhǔn)語句或表達(dá)式來運(yùn)行。b=2+5*2;vara=eval(b);a的值為12。isNaN()如果括號內(nèi)的值是“NaN（不是數(shù)字）”,則返回true否則返回false。parseInt()返回把括號內(nèi)的內(nèi)容轉(zhuǎn)換成整數(shù)之后的值。如果括號內(nèi)是字符串，則字符串開頭的數(shù)字部分被轉(zhuǎn)換成整數(shù)，如果以字母開頭，則返回“NaN”。parseFloat()返回把括號內(nèi)的字符串轉(zhuǎn)換成浮點(diǎn)數(shù)之后的值，字符串開頭的數(shù)字部分被轉(zhuǎn)換成浮點(diǎn)數(shù)，如果以字母開頭，則

59、返回“NaN”。toString()用法：.toString()；把對象轉(zhuǎn)換成字符串。如果在括號中指定一個數(shù)值，則轉(zhuǎn)換過程中所有數(shù)值轉(zhuǎn)換成特定進(jìn)制。escape()返回括號中的字符串經(jīng)過編碼后的新字符串。該編碼應(yīng)用于URL，也就是把空格寫成“%20”這種格式?！?”不被編碼，如果要“+”也被編碼，請用：escape(.,1)。unescape()是escape()的反過程。解編括號中字符串成為一般字符串。14.3文檔對象文檔對象是指在網(wǎng)頁文檔里劃分出來的對象。在JavaScript能夠涉及的范圍內(nèi)有如下幾個“大”對象：window,document,location,navigator,scr

60、een,history等。下面是一個文檔對象樹。要引用某個對象，就要把父級的對象都列出來。例如，要引用某表單“MyForm”的某文字框“UserName”，就要用“document.MyForm.UserName”。引用Form下的表單元素對象不使用名稱，比如Button，而是通過對象的ID或Name進(jìn)行引用，或使用它所屬的對象數(shù)組。比如：varname=document.getElementById(UserName);/通過id獲取值navigatorscreenwindowhistorylocationframes;Framedocumentanchors;links;Linkapple