Javascript經(jīng)典案例

1、1. String2. 3. 4. 目目 錄錄第二講 表單驗(yàn)證及事件String對象o常用的String對象n使用 var 語句 var newstr = 這是我的字符串n創(chuàng)建 String 對象 var newstr = new String(這是我的字符串“)n調(diào)用方法和屬性 字符串對象.屬性名 字符串對象.方法名( )String對象名 稱說 明屬性length獲取字符串字符的個數(shù)方法indexOf(“子字符串”，起始位置) 查找子字符串的位置charAt(index)獲取位于指定索引位置的字符substring(index1,index2 )截取兩個索引位置之間的字符串toLowerC

2、ase( )將字符串轉(zhuǎn)換成小寫 toUpperCase( )將字符串轉(zhuǎn)換成大寫 oString對象常用的屬性和方法語法：語法：indexOf(“查找的子字符串查找的子字符串”，查找的起始位置，查找的起始位置)返回子字符串所在的位置；如果沒找到，返回返回子字符串所在的位置；如果沒找到，返回 1例如：例如：var xvar y=“abcdefg”;x=y.indexOf(“c” , 0 ); /返回結(jié)果為返回結(jié)果為2，起始位置是，起始位置是0數(shù)值判斷函數(shù)o數(shù)值判斷函數(shù)數(shù)值判斷函數(shù)o功能：功能：判斷變量的值是否為數(shù)值，判斷變量的值是否為數(shù)值，“NaN”代表代表“Not a Number”，若返回值為

3、，若返回值為true，則表示自變量不是數(shù)值。，則表示自變量不是數(shù)值。o語法：語法：isNaN(測試值測試值)數(shù)學(xué)(Math)對象o數(shù)學(xué)(Math)對象o方法：o abs() 返回某數(shù)的絕對值o acos() 返回某數(shù)的反余弦值(以弧度為單位)o asin() 返回某數(shù)的反正弦值(以弧度為單位)o atan() 返回某數(shù)的反正切值(以弧度為單位)o ceil() 返回大于或等于指定數(shù)的最小整數(shù)o floor() 與ceil相反o max() 返回兩數(shù)間的較大值o min() 返回兩數(shù)間的較小值o pow() 返回m的n次方(其中,m為底,n為指數(shù))o random() 返回0和1之間的一個偽隨機(jī)

4、數(shù)o round() 返回某數(shù)四舍五入之后的整數(shù)日期時間(Date)對象o格式：格式：o 對象名對象名 = new Date ( 日期參數(shù)日期參數(shù) )o舉例：舉例：o today = new Date () /以當(dāng)日時間為以當(dāng)日時間為對象初值。對象初值。日期時間(Date)對象方法:o getYear()返回年份值返回年份值o getMonth() 返回月份值返回月份值o getDate() 并返回日期并返回日期o getDay() 返回星期幾返回星期幾o(hù) getHours() 返回小時數(shù)返回小時數(shù)o getMinutes() 返回分鐘數(shù)返回分鐘數(shù)o getSeconds() 返回秒數(shù)返回秒數(shù)

5、o getTime() 返回完整的時間返回完整的時間o setDate() 改變改變Date對象的日期對象的日期o setHours() 改變小時數(shù)改變小時數(shù)o setMinutes() 改變分鐘數(shù)改變分鐘數(shù)o setMonth() 改變月份改變月份o setSeconds() 改變秒數(shù)改變秒數(shù)o setTime() 改變完整的時間改變完整的時間o setYear() 改變年份改變年份o setTimeout 按照間隔時間按照間隔時間(毫秒毫秒)來調(diào)用函數(shù)來調(diào)用函數(shù)日期時間(Date)對象o 月份數(shù)為（月份數(shù)為（0-11）o 日期數(shù)為（日期數(shù)為（1-31）o 星期數(shù)為（星期數(shù)為（0-6）o 小

6、時數(shù)為（小時數(shù)為（0-23）o 分鐘數(shù)為（分鐘數(shù)為（0-59）o 秒數(shù)為秒數(shù)為 （0-59）o 毫秒數(shù)為（毫秒數(shù)為（0-999） Date對象做時鐘顯示function disptime( ) var now= new Date( ) ; var hour = now.getHours() ; if (hour=0 & hour =12) document.write(上午好上午好!) if (hour12 & hour= 18) document.write(下午好下午好!) ; if (hour18 & hour 24) document.write(晚上好晚上好!

7、) ; document.write(今天日期今天日期:+now.getYear()+年年+(now.getMonth( )+1)+月月+now.getDate()+日日) ; document.write(現(xiàn)在時間現(xiàn)在時間:+now.getHours()+點(diǎn)點(diǎn)+now.getMinutes( )+分分) ; 獲得當(dāng)前日期和時間獲得當(dāng)前日期和時間獲得小時，即當(dāng)前是幾點(diǎn)獲得小時，即當(dāng)前是幾點(diǎn)月份數(shù)字月份數(shù)字011，注意注意1判斷上午、下午還是晚上判斷上午、下午還是晚上Date對象做時鐘顯示上一頁上一頁P(yáng)PT示例中時鐘不能動態(tài)改變，怎么辦？示例中時鐘不能動態(tài)改變，怎么辦？由于時間在不停地走，所以應(yīng)

8、該每隔由于時間在不停地走，所以應(yīng)該每隔1秒調(diào)用顯示時間秒調(diào)用顯示時間的方法。如何解決？的方法。如何解決？使用使用setTimeout( )方法方法每隔每隔1秒調(diào)用顯示時間的方法秒調(diào)用顯示時間的方法osetTimeout的用法： setTimeout（“調(diào)用的函數(shù)”,”定時的時間”） 例：var myTimesetTimeout( “disptime( )”, 1000 ) ;每隔每隔1000毫秒執(zhí)行函毫秒執(zhí)行函數(shù)數(shù)disptime( )一次一次Date對象做時鐘顯示function disptime( ) var time = new Date( ); /獲得當(dāng)前時間獲得當(dāng)前時間 var ho

9、ur = time.getHours( ); /獲得小時、分鐘、秒獲得小時、分鐘、秒 var minute = time.getMinutes( ); var second = time.getSeconds( );document.myform.myclock.value =hour+:+minute+:+second+ ;var myTime = setTimeout(disptime(),1000); 當(dāng)前時間：當(dāng)前時間： 設(shè)置文本框的內(nèi)容設(shè)置文本框的內(nèi)容為當(dāng)前時間為當(dāng)前時間設(shè)置定時器每隔設(shè)置定時器每隔1秒秒(1000毫秒毫秒),調(diào)用函數(shù)調(diào)用函數(shù)disptime()執(zhí)行執(zhí)行小結(jié)2編寫如左

10、圖所示，具有在網(wǎng)頁中指定位置顯示動態(tài)時鐘效果的頁面。自動動態(tài)變自動動態(tài)變化的時鐘化的時鐘為什么需要表單驗(yàn)證服務(wù)器IE腳本在客戶端執(zhí)行，減輕服務(wù)器端的壓力腳本在客戶端執(zhí)行，減輕服務(wù)器端的壓力客戶端客戶端用戶輸入用戶輸入客戶端客戶端用戶輸入用戶輸入客戶端客戶端用戶輸入用戶輸入發(fā)送請求發(fā)送請求返回響應(yīng)返回響應(yīng)發(fā)送請求發(fā)送請求返回響應(yīng)返回響應(yīng)發(fā)送請求發(fā)送請求返回響應(yīng)返回響應(yīng)表單驗(yàn)證的內(nèi)容-1不能為空且不能為空且不能有數(shù)字不能有數(shù)字不能為空且不能為空且不能有數(shù)字不能有數(shù)字不能為空，且只不能為空，且只能包括字母、數(shù)能包括字母、數(shù)字和下劃線字符字和下劃線字符密碼不能為空并且最密碼不能為空并且最少為少為6位，

11、還要求兩位，還要求兩次輸入的密碼要一致次輸入的密碼要一致表單驗(yàn)證的內(nèi)容-2不能為空且包含不能為空且包含字符字符和和.只能二選一只能二選一年月日不能年月日不能為空，且不為空，且不能超出其要能超出其要求的范圍求的范圍表單驗(yàn)證的思路 如何編寫腳本驗(yàn)證表單？1、獲取表單元素的值（、獲取表單元素的值（String類型），然后進(jìn)行判斷類型），然后進(jìn)行判斷2、觸發(fā)、觸發(fā)表單表單（FORM）的提交事件的提交事件（onSubmit）表單驗(yàn)證的思路檢查電子郵件檢查電子郵件email是否包含是否包含“”和和”.” function checkEmail( ) var strEmail=document.myform

12、.txtEmail.value; if (strEmail.length=0) alert(電子郵件不能為空電子郵件不能為空!); return false; if (strEmail.indexOf(,0)=-1) alert(電子郵件格式不正確電子郵件格式不正確n必須包含必須包含符號！符號！); return false; if (strEmail.indexOf(.,0)=-1) alert(電子郵件格式不正確電子郵件格式不正確n必須包含必須包含.符號！符號！); return false; return true; 返回結(jié)果返回結(jié)果-1表示表示沒找到?jīng)]找到“”字符字符獲取表單元素的值獲

13、取表單元素的值表單的提交事件表單的提交事件表單驗(yàn)證的思路表單驗(yàn)證的思路function checkUserName() /驗(yàn)證用戶名驗(yàn)證用戶名 var fname = document.myform.txtUser.value; if(fname.length != 0) for(i=0;ifname.length;i+) var ftext = fname.substring(i,i+1); if(ftext 0) alert(名字中包含數(shù)字名字中包含數(shù)字 n+請刪除名字中的數(shù)字和特殊字符請刪除名字中的數(shù)字和特殊字符); return false else alert(請輸入請輸入“名字名字

14、”文本框文本框); document.myform.txtUser.focus(); return false return true; 驗(yàn)證用戶名不驗(yàn)證用戶名不能包含數(shù)字能包含數(shù)字獲取表單元素的值獲取表單元素的值表單驗(yàn)證的思路 function passCheck() /驗(yàn)證密碼驗(yàn)證密碼var userpass = document.myform.txtPassword.value;if(userpass = )alert(未輸入密碼未輸入密碼 n + 請輸入密碼請輸入密碼);document.myform.txtPassword.focus();return false; if(userp

15、ass.length 6)alert(密碼必須多于或等于密碼必須多于或等于 6 個字符。個字符。n);return false; return true; 驗(yàn)證密碼不少于驗(yàn)證密碼不少于6位位獲取表單元素的值獲取表單元素的值表單驗(yàn)證的思路 function validateform() if(checkUserName()&passCheck( ) return true; else return false; 同時調(diào)用驗(yàn)證用戶同時調(diào)用驗(yàn)證用戶名和驗(yàn)證密碼方法名和驗(yàn)證密碼方法表單的提交事件表單的提交事件觸發(fā)表單提交事件觸發(fā)表單提交事件小結(jié) 1編寫如下圖所示，實(shí)現(xiàn)登錄表單的驗(yàn)證功能文本框控

16、件如何實(shí)現(xiàn)如下圖所示，完善電子郵件的例子。用戶單擊時用戶單擊時,郵郵箱的提示信息箱的提示信息自動清除自動清除提示電子郵提示電子郵件格式不對件格式不對輸入的信息輸入的信息自動被選中自動被選中并高亮顯示并高亮顯示文本框控件o文本框?qū)ο蟮某Ｓ脤傩浴⒎椒?、事件使用文本框?qū)ο蟮南嚓P(guān)方法，實(shí)現(xiàn)選中效果使用文本框?qū)ο蟮南嚓P(guān)方法，實(shí)現(xiàn)選中效果名 稱說 明屬性value設(shè)置或獲取文本框的值方法focus( )獲得焦點(diǎn)select( )選中文本內(nèi)容，突出顯示輸入?yún)^(qū)域事件onFocus光標(biāo)進(jìn)入某個文本框腳本運(yùn)行onBlur文本框失去焦點(diǎn)腳本運(yùn)行onKeyPress當(dāng)一個鍵按下并釋放時去觸發(fā)一個事件文本框控件 . f

17、unction clearText( ) if (document.myform.txtEmail.value=“請輸入真實(shí)的電子郵箱，我們將請輸入真實(shí)的電子郵箱，我們將 發(fā)送激活密碼發(fā)送激活密碼) document.myform.txtEmail.value= ; document.myform.txtEmail.style.color=red; *必填必填清空文本框的內(nèi)容清空文本框的內(nèi)容修改文本框的顏色修改文本框的顏色文本框獲得焦點(diǎn)就調(diào)文本框獲得焦點(diǎn)就調(diào)用方法用方法clearText( )小結(jié) 2編寫如下圖所示，實(shí)現(xiàn)注冊表單的驗(yàn)證功能每個文本每個文本框非空框非空密碼和再次輸入密碼和再次輸入

18、的密碼必須相同的密碼必須相同年份必須年份必須是是20打頭打頭日期必須在日期必須在1到到31之間之間常見錯誤-1function validateform( )if(sNameCheck() & passCheck()&bdaycheck() return true; else return false; 提交按鈕提交按鈕type=submit清空按鈕清空按鈕type=reset常見錯誤-2function validateform( )if(sNameCheck() & passCheck()&bdaycheck() return true; else retu

19、rn false; onsubmit不是登不是登錄按鈕的事件錄按鈕的事件常見的事件事件事件動作動作事件事件動作動作Abort中止正在加載的對象Unload關(guān)閉當(dāng)前網(wǎng)頁Blur失去焦點(diǎn)MouseDown按下鼠標(biāo)左鍵Focus獲取焦點(diǎn)MouseMove移動鼠標(biāo)指針Change改變對象的值MouseOut鼠標(biāo)指針離開某對象Click在對象上單擊鼠標(biāo)MouseOver鼠標(biāo)指針懸停于某對象之上DblClick在對象上雙擊鼠標(biāo)MouseUp放開鼠標(biāo)左鍵DrogDrop拖拽對象Move窗口被移動時Error加載文件或圖形時發(fā)生錯誤Resize窗口大小被改變KeyDown按下鍵盤上的任意鍵的瞬間Select選

20、擇某對象KeyPress按下鍵盤上的任意鍵時Submit單擊表單上的Submit按鈕KeyUp某鍵被按下后彈起來的瞬間Reset單擊表單上的Reset按鈕Load 瀏覽器讀入文件時如何使用圖片代替提交按鈕為了美觀，現(xiàn)把提交按鈕變成圖片，但仍然保持為了美觀，現(xiàn)把提交按鈕變成圖片，但仍然保持表單的驗(yàn)證功能？如何實(shí)現(xiàn)？表單的驗(yàn)證功能？如何實(shí)現(xiàn)？使用圖片的單擊事件。使用圖片的單擊事件。onClick=checkForm( )如何使用圖片代替提交按鈕根據(jù)上述分析和提供的素材頁面來實(shí)現(xiàn)表單驗(yàn)證。根據(jù)上述分析和提供的素材頁面來實(shí)現(xiàn)表單驗(yàn)證。素材頁面素材頁面 function checkForm( ) if

21、( document.myform.txtUserName.value.length=0) alert(用戶名不能為空！用戶名不能為空！); document.myform.txtUserName.focus( ); 檢驗(yàn)是否為空檢驗(yàn)是否為空單擊事件，調(diào)用單擊事件，調(diào)用表單驗(yàn)證函數(shù)表單驗(yàn)證函數(shù)如何使用圖片代替提交按鈕能進(jìn)行表單驗(yàn)證，但即使是正確填寫了表單，也能進(jìn)行表單驗(yàn)證，但即使是正確填寫了表單，也不能提交頁面（點(diǎn)擊不能提交頁面（點(diǎn)擊“注冊注冊”沒反映）。沒反映）。如何使用圖片代替提交按鈕因?yàn)閳D片不具備因?yàn)閳D片不具備“提交提交”按鈕的提交功能，所以需按鈕的提交功能，所以需要人工調(diào)用提交方法要人

22、工調(diào)用提交方法 submit( ) 。 function checkForm( ) if ( document.myform.txtUserName.value.length=0) alert(用戶名不能為空！用戶名不能為空！); document.myform.txtUserName.focus( );else document.myform.submit( ); 查看源代碼查看源代碼如果表單輸入合法，則提交表單如果表單輸入合法，則提交表單制作回車切換輸入的效果輸入完畢后回車，默認(rèn)會提交表單。輸入完畢后回車，默認(rèn)會提交表單。 頁面效果頁面效果如何制作回車如何制作回車Tab切換效果？切換效果？

23、 頁面效果頁面效果keyCode代碼代碼說明代碼說明8BackSpace34Next9Tab35End12Clear36Home13Enter37Left16Shift_L38Up17Control_L39Right18Alt_L40Down20Caps_Lock46Delete33Prior65a A48090z Z制作回車切換輸入的效果1、 使用鍵盤輸入事件使用鍵盤輸入事件onKeyDown事件事件 2、 檢查輸入是否是回車鍵檢查輸入是否是回車鍵ASCII碼碼13，若是則將，若是則將 輸入改為輸入改為Tab鍵鍵ASCII碼碼9 function changeFocus( ) if (eve

24、nt.keyCode=13) event.keyCode=9; 鍵盤按下，調(diào)用實(shí)鍵盤按下，調(diào)用實(shí)現(xiàn)現(xiàn)Tab效果的函數(shù)效果的函數(shù)修改回車鍵為修改回車鍵為Tab鍵鍵Event事件對象包含輸入鍵信息事件對象包含輸入鍵信息制作回車切換輸入的效果上述注冊頁面中，需要給每個文本框添加鍵盤按上述注冊頁面中，需要給每個文本框添加鍵盤按下事件，有沒有更簡單的辦法？下事件，有沒有更簡單的辦法？ okeyCode：得到在鍵盤上按下的鍵osrcElement： .type 得到標(biāo)簽類型 .tagname 得到標(biāo)簽名稱event對象制作回車切換輸入的效果通過給通過給document對象添加鍵盤事件。對象添加鍵盤事件。

25、function changeFocus( ) if (event.keyCode=13 & event.srcElement.type!=button & event.srcElement.type!=submit ) event.keyCode=9; /調(diào)用表單的調(diào)用表單的onKeyDown事件事件如果按鍵是回車鍵，并且控件如果按鍵是回車鍵，并且控件類型不是提交、重置按鈕等按類型不是提交、重置按鈕等按鈕，則變?yōu)殁o，則變?yōu)門ab切換切換document對象的對象的onKeyDown事件事件，它將接收，它將接收頁面中所有的鍵盤事件頁面中所有的鍵盤事件數(shù)組與級聯(lián)列表框預(yù)習(xí)檢查o什

26、么是省市級聯(lián)特效？o在JavaScript中，如何定義一維數(shù)組Array？o在JavaScript中，是否支持二維數(shù)組？本章任務(wù)演示示例演示示例1 1：頁面效果頁面效果演示示例演示示例2 2：頁面效果頁面效果 制作通用的省市級聯(lián)效果制作通用的省市級聯(lián)效果 制作學(xué)期、課程級聯(lián)效果制作學(xué)期、課程級聯(lián)效果o會使用下拉列表框控件實(shí)現(xiàn)省市級聯(lián)功能o會使用數(shù)組優(yōu)化省市級聯(lián)功能本章目標(biāo)下拉列表框o得到選擇項(xiàng)的索引（從0開始） 表單名.列表名.selectedIndex;o清空列表項(xiàng) 表單名.列表名.options.length=0;o創(chuàng)建選項(xiàng) Option1= new Option(選項(xiàng)名,選項(xiàng)值);o增加

27、選項(xiàng) 表單名.列表名.options.add(Option1);實(shí)現(xiàn)簡單的省市級聯(lián)功能如何實(shí)現(xiàn)省市級聯(lián)的效果？如何實(shí)現(xiàn)省市級聯(lián)的效果？頁面效果頁面效果1、利用省份下拉框的選項(xiàng)改變事件、利用省份下拉框的選項(xiàng)改變事件onChange2、根據(jù)用戶選擇的省份，動態(tài)添加城市下拉框的值、根據(jù)用戶選擇的省份，動態(tài)添加城市下拉框的值onChange選項(xiàng)選項(xiàng)/內(nèi)容改變事件內(nèi)容改變事件動態(tài)添加動態(tài)添加城市選項(xiàng)城市選項(xiàng)Option實(shí)現(xiàn)簡單的省市級聯(lián)功能演示實(shí)現(xiàn)步驟：演示實(shí)現(xiàn)步驟： 1、添加省份、城市下拉框（、添加省份、城市下拉框（演示素材演示素材）省份下拉框名稱省份下拉框名稱selProvince表單名稱表單名稱m

28、yform省份下拉框選項(xiàng)省份下拉框選項(xiàng)option城市下拉框名稱城市下拉框名稱selCity實(shí)現(xiàn)簡單的省市級聯(lián)功能演示實(shí)現(xiàn)步驟：演示實(shí)現(xiàn)步驟： 2、查看生成的、查看生成的HTML代碼代碼. -請選擇開戶帳號的省份請選擇開戶帳號的省份- 四川省四川省 山東省山東省 湖北省湖北省 . -請選擇開戶帳號的城市請選擇開戶帳號的城市- .多個選項(xiàng)構(gòu)成多個選項(xiàng)構(gòu)成選項(xiàng)數(shù)組選項(xiàng)數(shù)組options選項(xiàng)選項(xiàng)Option城市下拉框暫城市下拉框暫時沒有具體的時沒有具體的城市選項(xiàng)城市選項(xiàng)實(shí)現(xiàn)簡單的省市級聯(lián)功能演示實(shí)現(xiàn)步驟：演示實(shí)現(xiàn)步驟： 3、添加動態(tài)改變城市選項(xiàng)的、添加動態(tài)改變城市選項(xiàng)的changeCity( )函數(shù)

29、函數(shù)function changeCity( ) var province=document.myform.selProvince.value; var newOption1,newOption2; switch(province) case 四川省四川省 : newOption1= new Option(成都市成都市,chengdu); newOption2= new Option(瀘州市瀘州市,luzhou); break; case 湖北省湖北省 : document.myform.selCity.options.length=0; document.myform.selCity.opt

30、ions.add(newOption1); document.myform.selCity.options.add(newOption2); 2、根據(jù)用戶選擇的省份，、根據(jù)用戶選擇的省份，動態(tài)創(chuàng)建城市下拉框選項(xiàng)動態(tài)創(chuàng)建城市下拉框選項(xiàng)1、獲取用戶選擇、獲取用戶選擇的省份的省份3、清除原有的選項(xiàng)、清除原有的選項(xiàng)4、將選項(xiàng)添加到選項(xiàng)數(shù)組、將選項(xiàng)添加到選項(xiàng)數(shù)組options查看源代碼查看源代碼實(shí)現(xiàn)簡單的省市級聯(lián)功能演示實(shí)現(xiàn)步驟：演示實(shí)現(xiàn)步驟： 4、選擇下拉框的、選擇下拉框的onChange事件，調(diào)用事件函數(shù)事件，調(diào)用事件函數(shù) -請選擇開戶帳號的省份請選擇開戶帳號的省份- 四川省四川省 山東省山東省 湖

31、北省湖北省當(dāng)用戶選擇不同的省份當(dāng)用戶選擇不同的省份時，將調(diào)用函數(shù)，改變時，將調(diào)用函數(shù)，改變城市下拉框的選項(xiàng)城市下拉框的選項(xiàng)查看源代碼查看源代碼實(shí)現(xiàn)簡單的省市級聯(lián)功能小結(jié)下拉框控件SELECT：o常用屬性nlengthnvaluenoptionsnselectedIndexo常用事件nonChangenonBlurnonFocus選項(xiàng)數(shù)組選項(xiàng)數(shù)組1、每個選項(xiàng)、每個選項(xiàng)Option可以動態(tài)創(chuàng)建可以動態(tài)創(chuàng)建new Option(”顯示內(nèi)容顯示內(nèi)容”，“值值”)2、動態(tài)添加選項(xiàng)、動態(tài)添加選項(xiàng)selCity.options.add(newOption1）3、清除選項(xiàng)、清除選項(xiàng)selCity.option

32、s.length=0讀取或設(shè)置被選項(xiàng)的索引號，讀取或設(shè)置被選項(xiàng)的索引號，第一個為第一個為0，其他類推，其他類推選項(xiàng)改變事件選項(xiàng)改變事件小結(jié)1實(shí)現(xiàn)學(xué)期、課程的級聯(lián)實(shí)現(xiàn)學(xué)期、課程的級聯(lián)學(xué)期學(xué)期第一學(xué)期第一學(xué)期第二學(xué)期第二學(xué)期第二學(xué)年第二學(xué)年 各學(xué)期對應(yīng)課程各學(xué)期對應(yīng)課程第一學(xué)期：第一學(xué)期：HTML、C#基礎(chǔ)基礎(chǔ)第二學(xué)期：第二學(xué)期：Sqlserver、Ado.Net第二學(xué)年：第二學(xué)年：A、XML數(shù)組對象o格式：對象名對象名 = new Array(元素個數(shù)元素個數(shù))o 或或 對象名對象名 = new Array(值值1,值值2,)o例如：fruit=new Array(2) 聲明了有聲明了有2個元素

33、的數(shù)組個元素的數(shù)組 fruit=new Array(“蘋果蘋果”,”橘子橘子”) 聲明了有聲明了有2 個數(shù)組元素的數(shù)組，并賦值。個數(shù)組元素的數(shù)組，并賦值。o屬性：index：數(shù)組元素的索引值：數(shù)組元素的索引值 length：數(shù)組長度：數(shù)組長度(數(shù)組元素個數(shù)數(shù)組元素個數(shù))。o方法：join()：將數(shù)組內(nèi)的所有值組合成一個字符串，：將數(shù)組內(nèi)的所有值組合成一個字符串， 并用特定符號分開。并用特定符號分開。 toString()：以字符串來表示數(shù)組和數(shù)組值。：以字符串來表示數(shù)組和數(shù)組值。 reverse()：將數(shù)組內(nèi)元素的索引次序翻轉(zhuǎn)過來：將數(shù)組內(nèi)元素的索引次序翻轉(zhuǎn)過來使用數(shù)組優(yōu)化省市級聯(lián)功能每個省實(shí)

34、際上有很多城市、并且城市數(shù)量不等，每個省實(shí)際上有很多城市、并且城市數(shù)量不等，有沒有更簡單、通用的辦法？有沒有更簡單、通用的辦法？var newOption1,newOption2; switch(province) case 四川省四川省 :newOption1= new Option(成都市成都市,chengdu);newOption2= new Option(瀘州市瀘州市,luzhou);break; case 湖北省湖北省 : newOption1= new Option(武漢市武漢市,wuhan);newOption2= new Option(襄樊市襄樊市,xiangfan);brea

35、k; case 山東省山東省 : newOption1= new Option(青島市青島市,qingdao);newOption2= new Option(煙臺市煙臺市,yantai); 如果有很多城市，就需要如果有很多城市，就需要定義很多變量，編寫很多定義很多變量，編寫很多重復(fù)的代碼重復(fù)的代碼解決辦法：解決辦法：使用數(shù)組！使用數(shù)組！使用數(shù)組優(yōu)化省市級聯(lián)功能JavaScript中的數(shù)組用法：中的數(shù)組用法： var emp = new Array(3);emp0 = Ryan Dias;emp1 = Graham Browne;emp2 = David Greene;emp.sort( );d

36、ocument.write(排序結(jié)果是：排序結(jié)果是：);for (var i in emp) document.write(empi+);1、創(chuàng)建數(shù)組對象、創(chuàng)建數(shù)組對象new Array(大小大小)2、為數(shù)組賦值。數(shù)組、為數(shù)組賦值。數(shù)組中可存放任意數(shù)據(jù)中可存放任意數(shù)據(jù) 3、調(diào)用數(shù)組的方法、調(diào)用數(shù)組的方法sort( )進(jìn)行排序進(jìn)行排序 4、循環(huán)輸出，等同：、循環(huán)輸出，等同：for(var i=0;iemp.length;i+)使用數(shù)組優(yōu)化省市級聯(lián)功能JavaScript中的數(shù)組用法：中的數(shù)組用法： var cityList = new Array( );cityList0=成都成都, 綿陽綿陽,

37、 德陽德陽, 自貢自貢, , 瀘州瀘州;cityList1=濟(jì)南濟(jì)南, 青島青島, 威海威海, 日照日照;cityList2 = 武漢武漢, 宜昌宜昌, 恩施恩施, 潛江潛江;document.write(四川省包括的城市是：四川省包括的城市是：); for (var j in cityList0) document.write(cityList0j +);1、創(chuàng)建數(shù)組，可、創(chuàng)建數(shù)組，可以不指定大小以不指定大小 2、為數(shù)組賦值。每、為數(shù)組賦值。每個單元格可以是數(shù)個單元格可以是數(shù)組。組。JavaScript不不支持二維數(shù)組支持二維數(shù)組 3、循環(huán)輸出、循環(huán)輸出.0-表示四川省的索引號，同理可表示四

38、川省的索引號，同理可以換為山東省索引號以換為山東省索引號1使用數(shù)組優(yōu)化省市級聯(lián)功能用數(shù)組優(yōu)化解決省市級聯(lián)問題：用數(shù)組優(yōu)化解決省市級聯(lián)問題： 012一維數(shù)組一維數(shù)組: cityList數(shù)組索引號數(shù)組索引號1下拉框索引號下拉框索引號selectedIndex01231、用數(shù)組存放每個用數(shù)組存放每個省省份份包含的城市包含的城市 2、根據(jù)用戶選擇根據(jù)用戶選擇的的省份索引號，省份索引號，找到對應(yīng)的找到對應(yīng)的數(shù)組索引號數(shù)組索引號3、根據(jù)對應(yīng)的數(shù)組內(nèi)、根據(jù)對應(yīng)的數(shù)組內(nèi)容，容，添加城市選項(xiàng)到添加城市選項(xiàng)到城市下拉框中城市下拉框中cityList0cityList1cityList2使用數(shù)組優(yōu)化省市級聯(lián)功能用數(shù)

39、組優(yōu)化解決省市級聯(lián)問題：用數(shù)組優(yōu)化解決省市級聯(lián)問題： function changeCity( ) var cityList = new Array( ); cityList0=成都成都, 綿陽綿陽, 德陽德陽, 自貢自貢, 瀘州瀘州; cityList1=濟(jì)南濟(jì)南, 青島青島, 日照日照; cityList2 = 武漢武漢, 宜昌宜昌, 潛江潛江; var pIndex=document.myform.selProvince.selectedIndex-1; var newOption1; document.myform.selCity.options.length=0; for (var

40、j in cityListpIndex) newOption1=new Option(cityListpIndexj, cityListpIndexj); document.myform.selCity.options.add(newOption1); 1、創(chuàng)建數(shù)組，存放各、創(chuàng)建數(shù)組，存放各省份對應(yīng)城市省份對應(yīng)城市 2、根據(jù)用戶選擇的省份索引號，、根據(jù)用戶選擇的省份索引號，獲取對應(yīng)數(shù)組索引號獲取對應(yīng)數(shù)組索引號 4、根據(jù)數(shù)組內(nèi)容創(chuàng)建選項(xiàng)，、根據(jù)數(shù)組內(nèi)容創(chuàng)建選項(xiàng)，并添加到城市下拉框并添加到城市下拉框3、清空原下拉框內(nèi)容、清空原下拉框內(nèi)容 小結(jié)2用數(shù)組優(yōu)化學(xué)期、選修課程的級聯(lián)。用數(shù)組優(yōu)化學(xué)期、選修課程的級聯(lián)。各學(xué)期對應(yīng)課程各學(xué)期對應(yīng)課程第一學(xué)期：第一學(xué)期：HTML、Java、SqlServer基礎(chǔ)、基礎(chǔ)、C#第二學(xué)期：第二學(xué)期：JavaScript、SqlServer高級、高級、ASP.Net第二學(xué)年：劉德華、李宇春、曾軼可第二學(xué)年：劉德華、李宇春、曾軼可使用文字下標(biāo)的數(shù)組再次優(yōu)化使用索引號必須要求省份的排列順序和數(shù)組編號相同。使用索引號必須要求省份的排列順序和數(shù)組編號相同。cityList0=成都成都, . 瀘州瀘州;cityList1=濟(jì)南濟(jì)南, 日照日照;cityList2=武漢武漢, 潛江潛江;cityList3=合肥合肥, 亳州亳州; ci