《《JavaScript語法》PPT課件.ppt》由會員分享，可在線閱讀，更多相關(guān)《《JavaScript語法》PPT課件.ppt（34頁珍藏版）》請在裝配圖網(wǎng)上搜索。
1、第六章,JavaScript 語法基礎(chǔ),2,目標(biāo),理解什么是 JavaScript 如何將 JavaScript 嵌入到 HTML 中 理解變量、數(shù)據(jù)類型和運算符 掌握 if-else 和 switch 語句,3,什么是JavaScript 3-1,一萬元整,Jeny Smiss,10,000/-,Jeny Smiss,A/c No. 010077,,瑞士銀行,Jeny 想在銀行存錢,驗證 Jeny 帳戶詳細信息,余額,帳號,簽名,帳戶驗證完畢,,4,什么是JavaScript 3-2,同樣，,Jeny,,Jeny 想創(chuàng)建一個電子郵件帳戶,,J *** 24 US,帳戶 Id： 密碼： 年齡：
2、 國家：,******,,這樣，JavaScript 將驗證數(shù)據(jù)并給出錯誤信息（如有）,5,什么是JavaScript,JavaScript 是一種腳本語言 提供用戶交互 動態(tài)更改內(nèi)容 數(shù)據(jù)驗證,6,將JavaScript嵌入網(wǎng)頁,可以將 JavaScript 語句插入 HTML 文檔，方式 如下： 使用 標(biāo)簽將語句嵌入文檔 將 JavaScript 源文件鏈接到 HTML 文檔中,7,使用 Script 標(biāo)簽,JavaScript 代碼, document.write(歡迎來到 JavaScript 世界); 盡情享受學(xué)習(xí)的快樂!!! ,,腳本代碼,設(shè)置語言,,8,使用外部 JS 文件,外部
3、 JavaScript 文件可以鏈接到 HTML 文檔中 SCRIPT 標(biāo)簽的 SRC（源文件）屬性可用于包括此外部文件,,9,使用外部 JS 文件,,JavaScript 代碼 (test.htm), 使用外部文件 以上文本是通過訪問外部 JavaScript 文件顯示的 ,,10,變量,變量名必須以字母或下劃線（_）開頭 變量可以包含數(shù)字、從 A 至 Z 的大小寫字母 JavaScript 區(qū)分大小寫，即變量 myVar、 myVAR 和 myvar 是不同的變量,11,聲明變量,,var a; “var” 用于聲明變量的關(guān)鍵字 “a” 變量名,,,同時聲明和初始化變量 var a= 1
4、0;,,a = 10;,聲明變量,聲明多個變量 var x, y, z = 10;,賦值,12,聲明變量, 使用變量 var x; x=prompt(淘寶網(wǎng)竟拍，請出一口價,1) ; document.write(拍賣價格+x+) // +用來連接多個字符串 document.write(恭喜您，您以最高價拍賣成功！); alert(歡迎下次光臨！); ,定義變量,賦 值,輸 出,prompt(“提示信息”,”默認值”) 將彈出提示對話框，接受用戶的輸入。點擊確定返回輸入的字符串，點擊取消反饋空字符串。,13,,,變量 a、b 和 c 只能 在其各自的函數(shù)中 被訪問,,,變量的作用域,,,,腳
5、本,函數(shù)function1 局部變量a,函數(shù)function2 局部變量b,函數(shù)function3 局部變量c,可由函數(shù) 1、函數(shù) 2 和函數(shù) 3 訪問,全局變量 gg,,,,,全局變量不需要以 var 關(guān)鍵字進行聲明，但局部變量則必須 以此關(guān)鍵字來聲明,14,常量,整型 浮點型 字符串型,和C語言一樣，js也有轉(zhuǎn)義字符，常用的就是： “ n ”,15,數(shù)據(jù)類型,16, var x=100; var y; var z; document.write(競拍SONY數(shù)碼相機 600萬像素 +x+$起價); y=prompt(加多少銀子？,1); z=x+y; alert(您最終的出價n+z+$);
6、 //”n”用于換行顯示 ,Prompt函數(shù)返回輸入的字符串,“+”號的用法-1,10020 ? bug,+字符串相連：100+”200”,200,17, var x=100; var y; var z; document.write(競拍SONY數(shù)碼相機 600萬像素 +x+$起價); y=prompt(加多少銀子？,1); z=x+parseFloat( y ); alert(您最終的出價n+z+$); //”n”用于換行顯示 ,parseFloat( )函數(shù)將字符串轉(zhuǎn)換為float數(shù)據(jù) parseInt( )函數(shù)將字符串轉(zhuǎn)換為int數(shù)據(jù) 如果轉(zhuǎn)換失敗，返回NaN值(not a num
7、ber),“+”號的用法-2,18,運算符,運算符對一個或多個變量或值（操作數(shù)）進行運算，并返 回一個新值 根據(jù)所執(zhí)行的運算，運算符可分為以下類別： 算術(shù)運算符 比較運算符 邏輯運算符,19,運算符,20,算術(shù)運算符-1,實現(xiàn)步驟： 1.使用DreamWeaver設(shè)計頁面 2.指定各個文本框的名稱 3.切換為代碼視圖，編寫腳本代碼 4.瀏覽并調(diào)試,21, function calcu( ) var numb1= document.calc.num1.value; var numb2= document.calc.num2.value; var total=parseFloat(numb1)*
8、parseFloat(numb2); document.calc.result.value=total; ,計算總價并顯示, ,添加單擊事件，單擊按鈕時調(diào)用“calcu()” 函數(shù),算術(shù)運算符-2,獲取表單中輸入的數(shù)據(jù)： document.表單名.表單元素名.value,,定義calcu( )計算函數(shù),實現(xiàn)兩個數(shù)相乘的功能.定義函數(shù)的語法： function 函數(shù)名(參數(shù)列表) //JavaScript語句； ,,22,比較運算符,比較運算符 2-1,23, function calcu() var numb1= document.calc.num1.value; var numb2= d
9、ocument.calc.num2.value; var total= parseFloat(numb1)*parseFloat(numb2); document.calc.result.value=total; if (total500) alert(購買總價超過500n支付時將贈送超級Q幣2枚！); .其他代碼略，同上例,,比較運算符,購買總價超過500， 贈送超級Q幣2枚！,24,運算符,邏輯運算符,25, function calcu() var numb1= document.calc.num1.value; var numb2= document.calc.num2.value;
10、 var total= parseFloat(numb1)*parseFloat(numb2); document.calc.result.value=total; if ((total500) .其他代碼略，同上例,,邏輯運算符,5001000 之間，贈送超級Q幣兩枚； 10002000之間，贈送IBM智能鼠標(biāo)一只； 2000以上，直接與貴賓臺聯(lián)系。,26,,條件語句用于測試條件。,if(條件) JavaScript代碼; ,語法：,if 語句 2-1,如果要執(zhí)行多個語句，必須將這些語句放在一對大括號 ( ) 內(nèi)。但如果只要執(zhí)行一個語句，則可以省略大括號,27, function calc
11、u() var numb1= document.calc.num1.value; var numb2= document.calc.num2.value; if ((numb1!=) .其他代碼略，同上例,,If語句 2-2,如果輸入框中的數(shù)據(jù)用戶漏填了， 出現(xiàn)NaN的 bug 為什么呢?,28,if else 語句 2-1,if(條件) //JavaScript代碼; else //JavaScript代碼; ,語法：,29, function calcu() var numb1= document.calc.num1.value; var numb2= document.calc.n
12、um2.value; if ((numb1!=) ,,If-else語句 2-2,提示沒有填寫購買數(shù)量或者競拍價格?,30,if (條件1) if (條件2) //JavaScript代碼; ,語法：,嵌套 if 語句 2-1,31, function calcu() var numb1= document.calc.num1.value; var numb2= document.calc.num2.value; if ((numb1!=) ..,,嵌套If語句 2-2,購買數(shù)量無意中輸入負數(shù)，出現(xiàn) bug 怎么辦?,32,switch 語句 2-1,switch (表達式
13、) case 常量1 : JavaScript語句; break; case 常量2 : JavaScript語句; break; ... default : JavaScript語句; ,語法：,33,switch語句 2-2,..... var f=document.calc.pay.value; //支付方式代號 var grade; //折扣率 var total= parseFloat(numb1)*parseFloat(numb2); switch(parseInt(f)) case 1: grade=0.6 ; //打6折優(yōu)惠 break; case 2:
14、 .同理其他方式打7折、八折 case 4: grade=0.9 ; //打9折優(yōu)惠 break; default: alert(請重新選擇支付方式！); return; var money=total*grade; //根據(jù)折扣率，計算實際總價 document.calc.result.value=money; alert(您享受了+grade*10+折優(yōu)惠！); ..,,銀行轉(zhuǎn)帳 打6折 電話支付 打7折 郵政匯款 打8折 Q幣支付 打9折,下拉列表框pay的選項和值,34,總結(jié),網(wǎng)頁中嵌入腳本有兩種方式：使用標(biāo)簽或外部 *. js文件 JavaScript 中聲明變量：var 變量名 “+”可以用于兩個數(shù)相加，還可以用于連接字符串 parseInt() 和 parseFloat() 函數(shù)將字符串分別轉(zhuǎn)換為整型和小數(shù) 運算符號分為算術(shù)運算符、比較運算符、邏輯運算符 條件語句分為if語句，if-else語句、if的嵌套 多分支語句switch根據(jù)表達式的值，進入不同的分支執(zhí)行,
《JavaScript語法》PPT課件.ppt
