《Dreamweaver 網(wǎng)頁設(shè)計與制作》課件-項目十一 制作飾品公司網(wǎng)站首頁-應(yīng)用 JavaScript 制作網(wǎng)頁特效

任務(wù)1認識JavaScript任務(wù)2更新飾品公司網(wǎng)站首頁——用JavaScript制作網(wǎng)頁特效項目十一?制作飾品公司網(wǎng)站首頁——應(yīng)用JavaScript制作網(wǎng)頁特效任務(wù)1?認識JavaScript◆了解JavaScript的發(fā)展過程◆理解JavaScript的特點一、JavaScript簡介JavaScript是一種基于對象的腳本語言，使用它可以開發(fā)Internet客戶端的應(yīng)用程序。JavaScript在HTML頁面中以語句的方式出現(xiàn)，并且執(zhí)行相應(yīng)的操作。JavaScript是一種基于客戶端瀏覽器的語言，有了JavaScript便可以使網(wǎng)頁變得生動。使用它的目的是與HTML和其他腳本語言一起實現(xiàn)在一個網(wǎng)頁中鏈接多個對象，與網(wǎng)絡(luò)客戶交互作用，從而開發(fā)客戶端的應(yīng)用程序。它是通過被嵌入或調(diào)入標準的HTML中來實現(xiàn)的。二、JavaScript的特點1.簡單性JavaScript是一種腳本編寫語言，采用小程序段的方式實現(xiàn)編程。像其他腳本語言一樣，JavaScript同樣是一種解釋性語言，提供了一個簡易的開發(fā)過程。它不需要先編譯，而是在程序運行過程中被逐行解釋。2.動態(tài)性相對于HTML和CSS語言的靜態(tài)而言，JavaScript是動態(tài)的，它可以直接對用戶或客戶輸入做出響應(yīng)，無須經(jīng)過Web服務(wù)程序。3.跨平臺性JavaScript是依賴于瀏覽器本身、與操作環(huán)境無關(guān)的腳本語言。只要瀏覽器支持JavaScript，計算機就可以正確執(zhí)行它。4.安全性JavaScript被設(shè)計為通過瀏覽器來處理并顯示信息，但它不能修改其他文件中的內(nèi)容。5.節(jié)省CGI的交互時間JavaScript是一種基于客戶端瀏覽器的語言，用戶在瀏覽的過程中填表、驗證的交互過程只是通過瀏覽器對調(diào)入HTML文檔中的JavaScript源代碼進行解釋執(zhí)行來完成的，即使是必須調(diào)用CGI的部分，瀏覽器只將用戶輸入驗證后的信息提交給遠程的服務(wù)器，大大減少了服務(wù)器的負載。三、JavaScript與CSSJavaScript與CSS都是可以直接在客戶端瀏覽器解析并執(zhí)行的腳本語言，通常意義上認為CSS是靜態(tài)的樣式設(shè)定，而JavaScript則是動態(tài)地實現(xiàn)各種功能。其中，CSS分別設(shè)置鼠標指針沒有經(jīng)過時的樣式和鼠標指針經(jīng)過時的樣式，JavaScript則動態(tài)地判斷鼠標指針的位置，從而調(diào)用不同的CSS樣式。任務(wù)2?更新飾品公司網(wǎng)站首頁——用JavaScript制作網(wǎng)頁特效◆理解JavaScript的基本語法◆掌握JavaScript基本語句的使用方法◆掌握JavaScript常用函數(shù)的使用方法◆理解JavaScript語言的交互性和動態(tài)性◆掌握利用JavaScript語言制作網(wǎng)頁特效的方法一、數(shù)據(jù)類型和變量1.數(shù)據(jù)類型下面對各種數(shù)據(jù)類型分別進行介紹。string字符串類型：字符串是用單引號或雙引號來說明的（可以使用單引號來輸入包含雙引號的字符串，反之亦然），其內(nèi)容為如“網(wǎng)頁設(shè)計”“NextStation”和“CSS樣式設(shè)計”等文本。數(shù)值數(shù)據(jù)類型：JavaScript支持整數(shù)和浮點數(shù)，整數(shù)可以為正數(shù)、0或者負數(shù)；浮點數(shù)可以包含小數(shù)點，也可以包含一個“e”（大小寫均可，在科學(xué)記數(shù)法中表示“10的冪”），或者同時包含這兩項。boolean（布爾）類型：可能的boolean值有true和false。這是兩個特殊值，不能用作1和0。undefined數(shù)據(jù)類型：一個為undefined的值就是指在變量被創(chuàng)建后，未給該變量賦值時具有的值。null數(shù)據(jù)類型：null值指沒有任何值，什么也不表示。object類型：除了上面提到的各種常用類型外，對象也是JavaScript中的重要組成部分。2.變量在JavaScript中變量用來存放腳本中的值，這樣在需要使用該值時就可以用變量來代表，一個變量可以代表一個數(shù)字、文本或其他一些東西。變量的概念與其他程序語言中的變量是基本一致的。JavaScript是一種對數(shù)據(jù)類型要求不太嚴格的語言，所以不必聲明每一個變量的類型。變量聲明盡管不是必需的，但在使用變量之前先進行聲明是一種好的習慣。可以使用var語句來進行變量聲明。例如：vartemp;//沒有賦值varscore=95;//數(shù)值類型varmale=true;//布爾類型varauthor="isaac"http://字符串JavaScript是一種區(qū)分大小寫的語言，因此將一個變量命名為“computer”和將其命名為“Computer”是不一樣的。另外，變量名稱的長度是任意的，但必須遵循以下規(guī)則：（1）第1個字符必須是一個字母（大小寫均可）或一個下劃線。（2）后續(xù)的字符可以是字母、數(shù)字或下劃線。（3）變量名稱不能是系統(tǒng)的保留字，如true、for或return等。二、表達式及運算符表達式在定義完變量后，就可以進行賦值、改變和計算等一系列操作。這一過程通常又由表達式來完成?？梢哉f表達式是變量、常量、布爾以及運算的集合，因此表達式可以分為算術(shù)表達式、字符串表達式、賦值表達式、布爾表達式等。運算符是完成操作的一系列符號，在JavaScript中有算術(shù)運算符、比較運算符、布爾運算符。算術(shù)運算符又分單目運算符和雙目運算符。其中雙目運算符包括+（加）、-（減）、*（乘）、/（除）、％（取模）、|（按位或）、&（按位與）、<<（左移）、>>（右移）和>>>（右移，零填充）等。單目運算符包括-（取反）、～（取補）、++（遞加1）和--（遞減1）等。主要的比較運算符有：<（小于）、>（大于）、<=（小于等于）、>=（大于等于）、==（等于）和!=（不等于）。布爾邏輯運算符主要有：!（取反）、&（邏輯與）、&=（與之后賦值）、|（邏輯或）、|=（或之后賦值）、^（邏輯異或）、^=（異或之后賦值）、?:（三目操作符）、||（或）、==（等于）和!=（不等于）。三、基本語句JavaScript中的語句與其他語言的語句類似，用于實現(xiàn)程序的控制和各種基本的功能。在JavaScript中每條語句都以分號結(jié)束，但其本身對是否添加分號要求并不嚴格。但建議每條語句結(jié)束都加上分號，養(yǎng)成良好的編程習慣。JavaScript的基本語句主要包括條件語句、循環(huán)語句和函數(shù)等。1.條件語句條件語句主要有if語句、ifelse語句和switch語句等，if語句是最基本的條件語句，它的格式與C++相同，例如：if(表達式){語句1；語句2；｝如果表達式為true，則執(zhí)行大括號里的語句，為false則直接跳過該段語句，執(zhí)行后面的語句。如果需要在表達式為false時指定執(zhí)行某段代碼，則應(yīng)采用ifelse語句，例如：if(表達式){語句1；語句2；…}else{語句3；語句4；…}其中語句1～4可以是任意的合法JavaScript語句，甚至嵌套if語句等。2.循環(huán)語句循環(huán)語句一般指在一定條件下重復(fù)執(zhí)行的一段代碼，在JavaScript中提供了多種循環(huán)語句，包括for語句、while語句和dowhile語句等，還有用于跳出循環(huán)的break語句，用于終止當前循環(huán)并繼續(xù)執(zhí)行下一輪循環(huán)的continue語句等。for語句是使用頻率最高的循環(huán)語句，它的格式與C++類似，例如：for(initializationstatement;condition;adjuststatement){語