版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡介
第10章JavaScript基礎(chǔ)目錄JavaScript概述01JavaScript程序基礎(chǔ)02JavaScript消息框和函數(shù)03JavaScript事件處理0410.1JavaScript概述JavaScript是由Netscape公司開發(fā)并隨Navigator導(dǎo)航者一起發(fā)布的、介于Java與HTML之間、基于對象事件驅(qū)動的編程語言。因它的開發(fā)環(huán)境簡單，不需要Java編譯器，而是直接運(yùn)行在Web瀏覽器中，因此倍受Web設(shè)計(jì)者的喜愛。10.1.1JavaScript特點(diǎn)解釋性：不同于編譯性的語言，它是解釋性語言，直接由瀏覽器執(zhí)行。簡單性：語言結(jié)構(gòu)簡單，容易學(xué)習(xí)。安全性：不允許訪問本地的硬盤，同時(shí)不能將數(shù)據(jù)存入到服務(wù)器，不允許對網(wǎng)絡(luò)文檔進(jìn)行修改和刪除，只能通過瀏覽器實(shí)現(xiàn)信息瀏覽或動態(tài)交互，這樣可以有效的防止數(shù)據(jù)丟失。動態(tài)性：可以直接對用戶或客戶輸入做出響應(yīng)，不需要通過web服務(wù)器，它的響應(yīng)是通過事件驅(qū)動完成的，比如按下鼠標(biāo)、選擇菜單等等?？缙脚_性：只依賴于瀏覽器本身，與操作環(huán)境無關(guān)，只要能運(yùn)行瀏覽器的計(jì)算機(jī)并支持JavaScript的都可以運(yùn)行。10.1.2JavaScript代碼編寫下面來編寫第一個(gè)JavaScript程序。下面的JavaScript實(shí)現(xiàn)了彈出消息框的功能，運(yùn)行后屏幕會相繼顯示兩個(gè)消息框，第一個(gè)是：“歡迎光臨JS世界！”，第二個(gè)是“精彩內(nèi)容即將呈現(xiàn)！”。<html>
<head>
<ScriptLanguage="JavaScript">
alert("歡迎光臨JS世界!");
alert("精彩內(nèi)容即將呈現(xiàn)！");
</Script>
</head>
</html>JavaScript代碼由<ScriptLanguage="JavaScript">...</Script>說明，表示JavaScript腳本源代碼將放入其間。語句alert()是JavaScript的窗口對象方法，其功能是彈出一個(gè)具有OK對話框并顯示（）中的字符串。10.1.3JavaScript代碼的加入JavaScript代碼可以放在<head></head>，也可以直接將JavaScript腳本加入body中，例如：<body><ScriptLanguage="JavaScript">alert("歡迎光臨JS世界!");
alert("精彩內(nèi)容即將呈現(xiàn)！");</Script></body><ScriptLanguage="JavaScript">通過屬性Language="JavaScript"說明標(biāo)識中是使用的何種語言，這里是JavaScript語言,表示在JavaScript中使用的語言。上述代碼將在瀏覽器解析到<body>部分時(shí)被執(zhí)行，彈出兩個(gè)消息框。10.1.4JavaScript的調(diào)用方式JavaScript可以使用以下幾種方式調(diào)用：1）腳本在head標(biāo)記中，定義成函數(shù)的形式，在body中調(diào)用。例如下面在head中寫了一個(gè)函數(shù)，函數(shù)的內(nèi)容是彈出消息框，在body中通過命令按鈕的單擊事件來調(diào)用。<head>
<script>
functionmessage()
{
window.alert("welcome!");
}
</script>
<title>js調(diào)用</title></head><body>
<formaction="post">
<inputtype="button"onclick="message()"value="單擊">
</form></body>10.1.4JavaScript的調(diào)用方式2）腳本位于外部JS文件中，在head中引入，在body中調(diào)用。例如這里寫了一個(gè)“message（）”的函數(shù)，放在demo.js文件中，需要把該文件在head區(qū)通過插入JavaScript的標(biāo)簽導(dǎo)入。在body區(qū)域的按鈕的單擊事件中調(diào)用了“message()”函數(shù)。<!DOCTYPEhtml><htmllang="en"><head><scriptsrc="demo.js"></script>
<title>js調(diào)用</title></head><body>
<formaction="post">
<inputtype="button"onclick="message()"value="單擊">
</form></body></html>demo.js文件如下：functionmessage()
{
window.alert("welcome!");
}10.1.4JavaScript的調(diào)用方式3）直接在body中寫Javascript代碼，例如：<body><ScriptLanguage="JavaScript">alert（“歡迎光臨！”）；alert(“下面將進(jìn)入代碼學(xué)習(xí)”);</Script></body>10.1.4JavaScript的調(diào)用方式4）直接寫在事件處理的代碼中。這種方式直接在按鈕的單擊事件中寫入處理代碼。這種方式適合代碼短小的情況。下面的例子實(shí)現(xiàn)了單擊“單擊我”按鈕，彈出“操作錯誤”的消息框。<inputtype="button"onclick="alert('操作錯誤')"value="點(diǎn)擊我">10.2Javascript程序基礎(chǔ)10.2.1語句JavaScript語句是發(fā)給瀏覽器的命令，這些命令的作用是告訴瀏覽器該執(zhí)行什么操作。語句的類型主要包括：變量聲明語句、輸入/輸出語句、表達(dá)式語句、程序流向控制語句和返回語句。1)語句JS語句同Java語句相同，在語句中可以包含變量、關(guān)鍵字、運(yùn)算符和表達(dá)式，語句結(jié)束符使用英文分號“；”，在語句的結(jié)尾也可以不使用結(jié)束符。下面是JS語句的例子：varname="王小魚";varr=3.0;c=2*3.14*r;其中，第1條語句是定義一個(gè)變量name，將字符串“王小魚”賦值給變量name；第2條語句是將小數(shù)3.0賦值給浮點(diǎn)變量r；第3條語句是復(fù)合賦值語句，首先計(jì)算賦值運(yùn)算符“=”右側(cè)的表達(dá)式，然后將計(jì)算結(jié)果賦值給浮點(diǎn)變量c。10.2.1語句2）代碼塊JS代碼塊使用一對大括號“{}”將多條JS語句組合在一起，完成一個(gè)特定的功能。JS代碼塊一般在函數(shù)、條件結(jié)構(gòu)、循環(huán)結(jié)構(gòu)內(nèi)部使用。下面是一個(gè)JS函數(shù)的案例代碼：functionverify(){
r=3.0;c
=2*3.14*r;
alert(c);}其中，function為聲明JS函數(shù)的關(guān)鍵字，verify（）是函數(shù)名稱，函數(shù)主體使用一對大括號“{}”括起來，由大括號括起來的是Js代碼塊。10.2.1語句3）注釋語句
JS的注釋分為單行注釋和多行注釋，被注釋的內(nèi)容將不會被執(zhí)行。單行注釋使用雙斜杠，多行注釋用單斜杠加星號表示。varname=”ss”;//定義一個(gè)變量/*以下代碼將不會被執(zhí)行varn=5;for(i=1;i<=n;i++)s=s+i;*/10.2.2程序結(jié)構(gòu)JavaScript腳本語言是通過語句、函數(shù)、對象、方法和屬性來實(shí)現(xiàn)編程的，在程序結(jié)構(gòu)上有順序、循環(huán)、選擇三種基本結(jié)構(gòu)。任何簡單或復(fù)雜的算法都可以由這三種基本的結(jié)構(gòu)組合而成。圖10-2顯示了這三種結(jié)構(gòu)的流程圖：IF選擇結(jié)構(gòu)基本格式：if（條件表達(dá)式）
語句段１；
......
else
語句段２；
.....
功能：若表達(dá)式為true，則執(zhí)行語句段１；否則執(zhí)行語句段２。IF語句嵌套IF嵌套語句用于處理有多分支的情況，其執(zhí)行過程為依次判斷表達(dá)式的值，如果值為True，則執(zhí)行相應(yīng)的語句，否則執(zhí)行else后的語句。其結(jié)構(gòu)如下：if（條件表達(dá)式）語句塊１；
else
if（條件表達(dá)式）語句塊２；
elseif（條件表達(dá)式）語句塊３；
……
else語句塊４；
10.2.2程序結(jié)構(gòu)switchcase語句<scripttype="text/javascript">
varscore=prompt("請輸入你的成績");
switch(Math.floor(score/10))//獲得分?jǐn)?shù)的十位上的數(shù)字{case10:case9:document.write("考試成績?yōu)?+score+"分，優(yōu)秀！");break;case8:document.write("考試成績?yōu)?+score+"分，良好！");break;case7:document.write("考試成績?yōu)?+score+"分，中等！");break;
case6:document.write("考試成績?yōu)?+score+"分，及格！");break;case5:case4:case3:case2:case1:case0:document.write("考試成績?yōu)?+score+"分，不及格！");break;default:document.write("輸入錯誤！");break;
}
</script>10.2.2程序結(jié)構(gòu)循環(huán)語句for和whilefor語句和while語句都可以實(shí)現(xiàn)循環(huán)的功能，其中for語句的基本格式如下：
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è)主要語句之間，必須使用逗號分隔。10.2.2程序結(jié)構(gòu)while（條件）
{語句塊}；
該語句與For語句一樣，當(dāng)條件為真時(shí)，重復(fù)循環(huán)執(zhí)行語句塊，否則退出循環(huán)。用while語句實(shí)現(xiàn)的程序?yàn)椋?lt;body><scripttype="text/javascript">vari=1,sum=0;while(i<=100){sum=sum+i;i=i+1;}document.write("1～100的數(shù)字之和為"+sum);</script></body>10.2.3函數(shù)函數(shù)是預(yù)先編寫好的完成某一個(gè)獨(dú)立功能的代碼組合，是由事件驅(qū)動或者被調(diào)用的能夠重復(fù)執(zhí)行的單元。JavaScript函數(shù)定義：Function函數(shù)名（參數(shù),變元）{函數(shù)體;Return表達(dá)式;}函數(shù)由關(guān)鍵字Function定義，后面的函數(shù)名表示定義自己函數(shù)的名字，函數(shù)名區(qū)分大小寫。參數(shù)表是傳遞給函數(shù)使用或操作的值，其值可以是常量、變量或其它表達(dá)式。
用戶通過指定函數(shù)名（實(shí)參）來調(diào)用一個(gè)函數(shù)，當(dāng)調(diào)用函數(shù)時(shí),所用變量或字面量均可作為變元傳遞。要注意的是，必須使用return將值返回。
例如下面在<head>區(qū)寫了名稱為c(n1,n2)的函數(shù)，函數(shù)的功能是返回兩個(gè)參數(shù)（n1和n2）和的2倍。10.3Javascript消息框
JS消息對話框主要有三種：警告框alert(message)確認(rèn)框confirm(message)提示框:prompt(text,defautValue)警告框用于彈出警告消息。例如下面的js代碼執(zhí)行后，會彈出三條警告框消息。<ScriptLanguage="JavaScript">//JavaScriptAppearsherealert("此次執(zhí)行將刪除所有的數(shù)據(jù)!");alert("請?jiān)俅未_認(rèn)是否已經(jīng)保存數(shù)據(jù)!");alert("數(shù)據(jù)刪除后將不能再恢復(fù)！");</Script>10.4Javascript事件處理
JavaScript是采用事件驅(qū)動(event-driven)的模式。通常鼠標(biāo)或熱鍵的動作稱之為事件（Event），而由鼠標(biāo)或熱鍵引發(fā)的一連串程序的動作，稱之為事件驅(qū)動（EventDriver），對事件進(jìn)行處理程序或函數(shù)，稱之為事件處理程序（EventHandler）。在JavaScript中對象事件的處理通常由函數(shù)(function)擔(dān)任。其基本格式與函數(shù)全部一樣，可以將前面所介紹的所有函數(shù)作為事件處理程序。
格式如下：function
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 小學(xué)生防火安全教育
- 2024年山東省日照市中考二模語文試卷含答案
- 學(xué)前聽力障礙兒童的教育
- 2024-2025粵教粵科版小學(xué)二年級下冊科學(xué)期中考試卷附答案
- 行政管理學(xué)課件10
- 2025年管理人員崗前安全培訓(xùn)考試試題含答案【達(dá)標(biāo)題】
- 2024-2025日常安全培訓(xùn)考試試題答案a4版
- 2025承包商入廠安全培訓(xùn)考試試題附答案【研優(yōu)卷】
- 2025年企業(yè)管理人員安全培訓(xùn)考試試題及參考答案【模擬題】
- 2025班組安全培訓(xùn)考試試題含完整答案【名校卷】
- 企業(yè)防滲漏標(biāo)準(zhǔn)做法案例庫圖文豐富
- Unit 2 Listening and talking -高中英語人教版（2019）必修第一冊
- 醫(yī)院分娩記錄單
- JB/T 20173-2016輥壓干法制粒機(jī)
- GB/T 17872-1999江海直達(dá)貨船船型系列
- GB/T 12027-2004塑料薄膜和薄片加熱尺寸變化率試驗(yàn)方法
- 中醫(yī)手診培訓(xùn)資料課件
- 消防主機(jī)運(yùn)行記錄表(標(biāo)準(zhǔn)范本)
- 應(yīng)急處置措施交底
- Q∕GDW 12154-2021 電力安全工器具試驗(yàn)檢測中心建設(shè)規(guī)范
- 第四章 金融監(jiān)管(商業(yè)銀行管理-復(fù)旦大學(xué))
評論
0/150
提交評論