1、JavaScript表達式和邏輯控制語句的使用實驗一 一實驗目的掌握JavaScript的變量；掌握JavaScript的數據類型；掌握JavaScript的運算符；掌握JavaScript的邏輯控制語句。二實驗內容1、聲明一個變量str，為其賦值Hello World!，顯示該值；改變該變量值為Hello China!，然后再顯示該值。2、將110之間的奇偶數分開，頁面呈現方式如下：3、任意輸入一個年份，判斷是否為閏年。實驗二 函數部分一實驗目的掌握JavaScript的常用函數；二實驗內容編寫一個函數，在頁面上輸出11000之間所有能同時被3，5，7整除的證書，并要求每行顯示6個這樣的數。

2、ex050303.htm!-var n,nb=0;for(n=1;n 0) document.write(,);nb+;document.write(n);if (nb%6 = 0) document.write(n);document.write(nn);document.write(共有+nb+個數);/-實驗三 實驗目的：常用函數的使用。實驗內容：利用全局變量和函數，設計模擬幸運數字機游戲。設幸運數字為8，每次由計算機隨機生成3個19之間的隨機數，當這3個隨機數中有一個數字為8時，就算贏了一次。Ex050309.htmlvar win_rate=0;/贏率 var play_times=

3、0;/總次數var wins=0;/贏的次數var last_digits;/上次數字串var last_win;/上次是否贏?!-function PlayOnce()/模擬玩一次數字機游戲var i,digit;play_times+;last_digits=;last_win=false;for(i=0;i事件與對象實驗四實驗目的：表單的設計。實驗內容：設計一個表單，放入兩個按鈕，單擊它們時將顯示不同問候語。S07_02.HTM處理事件-HTML標記方式function hello_girl() alert(小姐,您好!); 實驗五實驗目的：內置對象的使用。實驗內容： 1 在頁面中顯示當

4、天日期。S06_03.HTM：使用new運算符var today;today = new Date();document.write(今天是+today.getFullYear()+年+(today.getMonth()+1)+月+today.getDate()+日);實驗六實驗目的：內置對象的使用。實驗內容： 2 在瀏覽器窗口的狀態欄中顯示當前瀏覽器的版本信息。S06_02.HTM訪問對象的屬性window.status = navigator.appVersion;實驗七實驗目的：內置對象的使用。實驗內容： 3 將用戶輸入的字符串反向輸出到頁面上，并且要求將其中的小寫字母轉換成大寫字母。S

5、06_07.HTM使用Stringvar origin_s,upper_s,i;origin_s = prompt(請輸入一行文字:,);upper_s = origin_s.toUpperCase();for(i=upper_s.length-1;i=0;i-) document.write(upper_s.charAt(i);實驗八實驗目的：內置對象的使用。實驗內容： 4 求PI的5次方，并四舍五入取整。S06_04.HTM使用Math對象alert(Math.round(Math.pow(Math.PI,5);實驗九實驗目的：內置對象的使用。實驗內容： 5 由圖像表示日期。ch3_14.

6、htm !-var sWeek = new Array(日,一,二 ,三,四,五,六);var myDate = new Date(); / 當天的日期var sYear = myDate.getFullYear(); / 年var sMonth = myDate.getMonth()+1; / 月var sDate = myDate.getDate(); / 日var sDay = sWeekmyDate.getDay(); / 星期document.write(imageDigits(sYear) +    + imageDigits(sMonth) +  &

7、nbsp; + imageDigits(sDate) + );/ 如果輸入數是1位數，在十位數上補0function formatTwoDigits(s) if (s10) return 0+s; else return s;/ 將數轉換為圖像，注意，在本文件的相同目錄下已有09的圖像文件，文件名為0.gif，1.gif 以此類推function imageDigits(s) var ret = ; var s = new String(s); for (var i=0; is.length; i+) ret += ; return ret;/-JavaScript對象的理解和使用實驗十一實驗

8、目的掌握JavaScript的常用的對象類型；掌握JavaScript對象屬性和方法的引用方式；了解JavaScript對象的常用屬性和方法；二實驗內容1、任意輸入一個字符串，單擊“確定”按鈕，輸出字符串的長度。2、猜數游戲，實現效果如下：3、設計實現一個帶開關的時鐘。 JavaScript事件的理解和使用實驗十一一實驗目的掌握JavaScript的常用的事件；掌握JavaScript事件的處理方式；了解如何通過HTML屬性和JavaScript屬性處理事件；二實驗內容1、設計實現一個頁面，當進入頁面時提示“您好，歡迎光臨”，當離開頁面時提示“您好，歡迎您下次再來”。2、設計實現如下頁面，要求

9、（1）單擊“提交”按鈕時逐一驗證頁面各項信息不允許為空；（2）如果哪一項信息不滿足要求，頁面焦點停留在該信息處；（3）單擊“重置”按鈕時，將頁面各項元素信息清空。 JavaScript的瀏覽器對象模型實驗十二一實驗目的掌握JavaScript瀏覽器對象的層次結構；掌握JavaScript瀏覽器對象的屬性和方法；二實驗內容1、設計實現如下頁面：（1）單擊“修改年齡”按鈕，彈出一個對話框：（2）單擊“確定”按鈕，將文本框內的年齡信息改為用戶重新輸入的信息；（3）單擊“取消”按鈕提示用戶“您按了取消按鈕”。2、設計實現如下頁面：（1）輸入學生信息后，單擊“提交”按鈕，頁面呈現方式如下：（2）單擊“復

10、位”按鈕，頁面呈現方式如下：實驗十三一實驗目的掌握JavaScript瀏覽器對象的層次結構；掌握JavaScript瀏覽器對象的屬性和方法；二實驗內容設計一個含有一個表單的頁面，并且在表單上放入一個文本框。編寫程序，當鼠標在頁面上移動時，鼠標的坐標將顯示在這個文本框中。ex070303.htm 1 在窗體中有兩個多選列表，用戶可以從左側列表中選擇任意項，添加到右側列表中。反之亦然。ch4_07.htm -1) / o為需要移動列表中當前選擇項對象 var o = fromList.optionscurrent; var t = o.text; var v = o.value; / 根據已選項新

11、建一個列表選項 var optionName = new Option(t, v, false, false); / 將該選項添加到移動到列表中 toList.optionstoLen= optionName; toLen+; / 將該選項從需要移動列表中清除 fromList.optionscurrent=null; current = fromList.selectedIndex; /- a b c onclick=moveList(leftList,rightList) input type=button name=backTo value= d e f 實驗十四一實驗目的：掌握表單的應

12、用二實驗內容設計一個有3個超鏈接的頁面，單擊這些鏈接時分別打開和關閉窗口以及關閉本身窗口。S08_01.HTM打開和關閉窗口var newwin;function opennewwin() newwin=open(,myWindow, height=100,width=400,top=10,left=0,toolbar=no,menubar=no, + scrollbars=no,resizable=no,location=no,status=no);function closenewwin() newwin.close();打開新窗口關閉新窗口關閉本窗

13、口2 設計一個表單，該表單有姓名和某種卡號兩個文本輸入框，其中這種卡號的格式為“XXXX-XXXX-XXXX-XXXX”（每個X代表一個數字），要求用戶單擊提交按鈕之前驗證這兩個輸入數據的有效性。S08_11.HTM驗證表單function validate() if(!checkName(document.myform.myname.value) return false; if(!checkNum(document.myform.mynumber.value) return false; alert(數據完全); return true;function checkName(s) var

14、ok = (s.length0); if(!ok) alert(名字輸入有誤，請查核！) return ok;function checkNum(n) var ok,i,ch; ok = (n.charAt(4)=- & n.charAt(9)=- & n.charAt(14)=-); if(!ok) alert( 卡號輸入有誤，請查核！); return false; i=0; while(i 9 | ch 0) alert( 卡號輸入有誤，查核！) return false; i+; return true; 姓名： 卡號： 3 設計3個按鈕，當單擊他們時分別使頁面的背景色變成紅、藍和綠色

15、。S08_13.HTM使用按鈕function ChangeBgColor(new_bgcolor) document.bgColor=new_bgcolor; 實驗十五一實驗目的掌握表單的驗證二實驗內容表單驗證單擊.htmlfunction check()var inst = 愛好：;if(document.myform.txt1.value=)alert(請輸入姓名！);elsealert(姓名：+document.myform.txt1.value );if(document.myform.sex0.checked) alert(性別：男);else alert(性別：女);if(doc

16、ument.myform.inst0.checked) inst += 游泳;if(document.myform.inst1.checked) inst += ,滑冰;if(document.myform.inst2.checked) inst += ,散步;if(inst=愛好：)alert(趕快培養一個愛好吧！);elsealert(inst);請輸入您的姓名：請選擇您的性別：男女請選擇您的愛好：游泳滑冰散步 JavaScript的應用與實踐實驗十六一實驗目的掌握JavaScript的綜合應用。二實驗內容1、設計實現如下頁面：要 求：（1）“姓名”、“學號”要求輸入本人的真實姓名與學號；

17、（2）“年齡”要求驗證不允許為空，且只能是小于100的正整數；（3）“出生日期”要求驗證年不允許為空，且只能為4位數字；（4）“身份證號”要求驗證不允許為空，且為有效的身份證號；（5）“家庭住址”要求驗證不允許為空，且最大長度為50個字符，且需驗證只能為中文、數字和字母；（6）“性別”、“班級”、“課程”要求驗證不允許為空；（7）“興趣”要求設置為高3行、寬30列，最大輸入長度為200，且需驗證不允許為空，且只能為中文、字母、符號。瀏覽器對象1 設計一個表單，可以讓用戶輸入姓名、年齡、職業，并編寫程序對年齡進行有效檢驗（16年齡40），數據合格后提交表單。ex080304.html:!-fun

18、ction validate()/驗證表單var age;age = parseInt(my_form.my_age.value);if(age40)window.alert(年齡必須在16,40之間,請重新輸入);my_form.my_age.focus();my_form.my_age.select();return false; /不提交有錯誤的表單return true;/向服務器提交表單數據/- 姓名： 年齡： 職業： 2 使用3種方法改變當前網頁的地址。ch5_05.htmwindow.open()location.hreflocation.replace()3 網頁中有一個鏈接，

19、點擊鏈接將顯示yahoo網頁，這時，點擊瀏覽器的后退按鈕，或點擊歷史列表中網頁地址，當前頁仍顯示yahoo網頁，而不能回到上一個網頁。Ch5_06.htmyahoo4 顯示歷史列表中的第一個網址的網頁。ch5_07.html歷史列表中的第一個網址5 列出表單中所有元素的名稱。S08_10.HTM遍歷表單中的所有元素 姓名: 密碼: 性別:男  女 愛好：音樂  運動 學歷: 小學 中學 大學 大學以上 自我介紹： var myform,element,i;myform = document.myform;document.write(表單中有+myform.length+個

20、元素:);for (i=0;i0) document.write(,); document.write();6 設計一個頁面，顯示document對象的一些屬性。S08_06.HTM顯示document對象的一些屬性太平洋電腦城document.write(當前文檔的標題:+document.title+);document.write(當前文檔的URL:+document.URL+);document.write(當前文檔的背景色:+document.bgColor+);document.write(當前文檔的最后修改日期:+document.lastModified

21、+);document.write(當前文檔包含+document.links.length+個超鏈接);document.write(當前文檔包含+document.images.length+個圖像);7 網頁中有一個可滾動的文字區域，含有10個錨點標記，其下方有10個鏈接，每一個鏈接將對應于一個錨點位置，用戶點擊任何一個鏈接，將跳到相應位置。ch4_09.htm 問題1: 回答1: 問題2: 回答2: 問題3: 回答3: 問題4: 回答4: 問題5: 回答5: 問題6: 回答6: 問題7: 回答7: 問題8: 回答8: 問題9: 回答9: 問題10: 回答10: 問題1 | 問題2 |

22、問題3 | 問題4 | 問題5 問題6 | 問題7 | 問題8 | 問題9 | 問題10 8 通過鏈接提交窗體。ch4_10.html 用戶名: 密碼: 提交動態表格徹底研究1對表格單元格的添加刪除修改并對其進行移動以及拷貝等操作，是目前應用開發中常用的技術。 2-53.htmfunction addcell() /添加新的單元格/插入新的一行oTargetRow = document.all(mytable1).insertRow();for(var k = 0; k document.all(mytable1).rows(0).cells.length; k+)var oCell = oT

23、argetRow.insertCell();if(k = 0)oCell.innerHTML = elseoCell.innerHTML = k;function checkall() /選中所有的單元格var eInput = document.all(mytable1).all.tags(INPUT);for(var i = 0; i eInput.length; i+)eInputi.checked = true;function uncheckall() var eInput = document.all(mytable1).all.tags(INPUT);for(var i = 0; i eInput.length; i+)eInputi.checked = false;function copycell() /拷貝單元格var eInput = document.a