原版Javascript程序設(shè)計實驗報告.doc

20 20 學(xué)年 第 學(xué)期Javascript程序設(shè)計實驗報告系 別： 專 業(yè)： 班 級： 姓 名： 學(xué) 號： 指導(dǎo)教師： 教務(wù)處制Javascript程序設(shè)計實驗報告實驗項目：javascript基礎(chǔ)實驗實驗要求1.請認真閱讀下面的項目描述。2.按照課程要求，每個班級分成若干個項目小組，每組人數(shù)大約23名同學(xué)，每個小組選出一名負責的同學(xué)。請負責同學(xué)做好小組內(nèi)分工。項目描述1.實驗項目是圍繞javascript綜合實驗平臺展開，涉及到平臺的外圍設(shè)備。2.要求熟練掌握javascript編程的基本流程。3.要求熟練使用javascript編程軟件平臺。4.項目實驗內(nèi)容由簡單到復(fù)雜，采用循環(huán)漸進的引導(dǎo)方式，使學(xué)生在輕松的氛圍中掌握javascript開發(fā)及軟件的使用。實驗一 Javascript基本頁面操作實驗?zāi)康?.JS頁面基本結(jié)構(gòu)。2.JS中變量基本格式。3.變量與字符串相連接并顯示結(jié)果。4.使用按鈕與function一一對應(yīng)來實現(xiàn)代碼功能。實驗內(nèi)容1.在C盤下創(chuàng)建文件夾1.1。在文件夾內(nèi)創(chuàng)建一個txt文檔，并命名為xx.1.html。xx是你學(xué)號后兩位。然后把課本P10的程序1.1輸入該文檔，并把內(nèi)容改為你自己的名字。內(nèi)容改為你的名字加歡迎標語。后面是P9的最后一行，但是把 里面的內(nèi)容換成你自己的名字。保存該文檔，并用google瀏覽器查看效果。2.請將課本P10倒數(shù)第四行代碼中的alert換成document.write并保存。你可以把任務(wù)01答案.html中的代碼直接進行修改。然后用google瀏覽器打開這個頁面看效果。想想alert和write的功能各是什么。3.請看課本P12的1.11練習(xí)，將任務(wù)01的頁面代碼的中增加alert(document.title)。保存后用google瀏覽器打開看效果。4.我們一般建議在body中完成頁面的布局設(shè)計，而將script代碼放在head中。我們?yōu)榱四軌虼_保讓程序執(zhí)行結(jié)果顯示在我們指定的位置，一個最簡單的方法是：在body中創(chuàng)建一個div，然后讓它來顯示程序執(zhí)行的結(jié)果。因為我們可以控制div出現(xiàn)的位置，所以就等于可以控制程序執(zhí)行結(jié)果出現(xiàn)的位置。我們一般在body中這樣放置一個id唯一的div然后再在script中通過如下代碼來使該div顯示指定內(nèi)容document.getElementById(d1).innerHTML=歡迎您訪問我的頁面;5.我們現(xiàn)在來學(xué)習(xí)js代碼的兩個基本概念。一個是書寫規(guī)范，這個在P15有介紹，我們建議使用每一行都加分號并回車換行的方式。另一個是變量。這個很有趣，以后每節(jié)課都會用。請新建xx.2.html，復(fù)制第一個頁面的基本代碼，然后把script標簽內(nèi)的代碼換成var x=Date();document.write(x);然后保存后打開xx.2.html看效果。這里的x是一個自定義的變量。6.新建一個頁面xx.3.html。在里面定義一個變量，變量內(nèi)容為你的姓名。然后讓頁面顯示這個變量與Date（）函數(shù)相連接的結(jié)果。比如你的變量名為x那么請讓你的頁面顯示x+Date()的內(nèi)容比如是x=張三為您報時，現(xiàn)在是請顯示x+Date()的內(nèi)容。7. 新建一個頁面xx.4.html。要求網(wǎng)頁打開的時候顯示以下內(nèi)容。XXX的網(wǎng)頁歡迎你?，F(xiàn)在是幾點幾分。xxx是你自己的名字。幾點幾分由下面的代碼結(jié)合而成。由于這個時間是從電腦主機時間獲得的，而我們機房的電腦時間可能不準確，所以這個題目你的時間顯示錯誤時沒關(guān)系的。只要它能顯示，然后每次F5刷新的時候它可以更新。就可以了。下面是一些擴展的知識點，給大家作為參考。var myDate = new Date(); /將當前日期時間賦值給變量myDatemyDate.getYear(); /獲取當前年份(2位)myDate.getFullYear(); /獲取完整的年份(4位,1970-?)myDate.getMonth(); /獲取當前月份(0-11,0代表1月)myDate.getDate(); /獲取當前日(1-31)myDate.getDay(); /獲取當前星期X(0-6,0代表星期天)myDate.getTime(); /獲取當前時間(從1970.1.1開始的毫秒數(shù))myDate.getHours(); /獲取當前小時數(shù)(0-23)myDate.getMinutes(); /獲取當前分鐘數(shù)(0-59)myDate.getSeconds(); /獲取當前秒數(shù)(0-59)myDate.getMilliseconds(); /獲取當前毫秒數(shù)(0-999)myDate.toLocaleDateString(); /獲取當前日期var mytime=myDate.toLocaleTimeString(); /獲取當前時間myDate.toLocaleString( ); /獲取日期與時間8. 新建一個頁面xx.5.html。在script中輸入如下內(nèi)容var x=5;var y=5;y+=x;document.write(y);請問y的值是多少？每次單擊F5鍵刷新的時候，y的值都是一樣的么？實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗二 Javascript基本功能控件練習(xí)實驗?zāi)康?.理解html網(wǎng)頁內(nèi)的body中有button，當click它時會調(diào)用function，而function中代碼運行的結(jié)果會放在一個變量里，顯示在一個div的innerHTML中。2.熟悉我們頁面的三個基本部分是button，function，div。3.掌握三個基本部分的功能：button觸發(fā)條件，function運行代碼，div顯示結(jié)果。這里面最重要的是function。我們今后一段時間學(xué)習(xí)的就是通過function來實現(xiàn)各種功能。實驗內(nèi)容1. 創(chuàng)建頁面，使其實現(xiàn)功能為：單擊頁面內(nèi)的按鈕時，頁面上顯示“xx歡迎你的訪問！”。2.創(chuàng)建頁面，要求實現(xiàn)功能為：單擊左邊的按鈕，頁面內(nèi)顯示xx為你報時，現(xiàn)在是*報時的時間通過Date（）來顯示。單擊右邊的按鈕，則清空頁面剛才顯示的內(nèi)容。3. 創(chuàng)建一個頁面（其實你可以在剛才的頁面基礎(chǔ)上進行修改）頁面內(nèi)有3個按鈕。按鈕上分別顯示“姓名”“班級”“輔導(dǎo)員”當你單擊某個按鈕的時候，頁面內(nèi)就會顯示該按鈕對應(yīng)的內(nèi)容。比如你單擊姓名，頁面內(nèi)就顯示出你的姓名。4. 創(chuàng)建一個頁面，該頁面中呈現(xiàn)出以下的心理測試題目。當用戶單擊A,B,C,D選項對應(yīng)的按鈕時，用戶將看到自己的選項對應(yīng)的測試答案。你屬于哪一種上班族？當你流落荒島時，饑寒交迫，你會以哪種捕食方式快速喂飽自己 A、設(shè)計抓山雞 B、采椰子 C、在岸邊捕魚 D、捕獵野豬 結(jié)果分析： 選擇A：你是“打拼型”上班族。 選擇B：你是“夢想型”上班族。 選擇C：你是“聰明型”上班族。 選擇D：你是“脫線型”上班族。 5.創(chuàng)建頁面完成課本第一章的課后習(xí)題要求的程序功能實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗三 文本框與函數(shù)參數(shù)傳遞練習(xí)實驗?zāi)康?.學(xué)習(xí)txt文本框和它對應(yīng)的value屬性的應(yīng)用2.掌握function函數(shù)傳遞參數(shù)的技術(shù)3.通過按鈕button的click事件，來調(diào)用function函數(shù)，并將其結(jié)果顯示在頁面上實驗內(nèi)容1.創(chuàng)建頁面實現(xiàn)功能：鼠標經(jīng)過圖片的時候會彈出一句話。用JS的術(shù)語來說，當一個img對象發(fā)生了onMouseOver事件的時候，則觸發(fā)一個alert事件。2.請先瀏覽頁面。然后把onmouseover改成onclick，保存后刷新頁面，點擊該圖片，體會一下改變的效果。3.請以它和img文件夾中的圖片為基礎(chǔ)，學(xué)習(xí)P22的程序2.5的代碼，修改guofeng.1.html，使得鼠標經(jīng)過圖片的時候，圖片會變成另外一張，而鼠標離開的時候，會換成原來的圖片。并將title改為你自己的名字。請把以下代碼更換為這句代碼的功能是當鼠標經(jīng)過則圖片換為02，鼠標離開時圖片換回01。4. 參考程序2.5創(chuàng)建一個頁面，頁面內(nèi)有一個button按鈕，按鈕的value為“你點我啊”。要求實現(xiàn)效果為：當單擊該按鈕后，該按鈕上的文字會顯示為“誰讓你點我的？！”思路：按鈕上顯示的文字就是button的value值。要改變一個按鈕自己的value值就是讓它onclick的時候，使得this.value變成你想要的值。建議：不必照搬課本上的代碼，任務(wù)1的頁面中有可以利用的代碼你盡可以復(fù)制粘貼過來，以節(jié)省時間。5.請修改guofeng.1.html，現(xiàn)在實現(xiàn)的效果是，該圖片原始引用圖片p1，鼠標經(jīng)過這個圖片和單擊這個圖片會彈出提示。我要求你改效果為：當鼠標經(jīng)過該圖片時，圖片改為p2，也就是讓this.src改為p2，當鼠標單擊該圖片時，圖片改為p3。6. 要求創(chuàng)建的頁面上有兩個按鈕，單擊按鈕1出第一個圖片，單擊按鈕2出第二個圖片。我要求你增加按鈕3和按鈕4，并且單擊相應(yīng)按鈕出相應(yīng)圖片。實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗四 HTML頁面交互設(shè)計練習(xí)實驗?zāi)康?.html交互頁面的基本結(jié)構(gòu)。2.義html常見空間的基本屬性。3.對頁面控件的一些基本操作和具體的函數(shù)定義。實驗內(nèi)容1.創(chuàng)建網(wǎng)頁。使其實現(xiàn)功能為：當點擊按鈕，文本框內(nèi)出現(xiàn)一句話：xx歡迎你訪問本網(wǎng)頁xx是你自己的名字。2. 創(chuàng)建網(wǎng)頁。要求實現(xiàn)如下功能：頁面內(nèi)共有三個文本框。第一個文本框前寫“請在此輸入您的姓名”，第二個文本框前寫“請在此輸入先生或者女士”，然后是一個“確定”按鈕。用戶單擊確定按鈕之后，第三個文本框會出現(xiàn)“XX先生/女士，您好！”的字樣。xx是第一個文本框中輸入的名字，先生/女士取決于用戶在第二個文本框輸入的內(nèi)容。3. 創(chuàng)建頁面使其點擊按鈕時在div和文本框text中同時出現(xiàn)你自己的姓名，班級或輔導(dǎo)員名字。本頁面我特別想講解的一點是，在script中，div對象后面跟的應(yīng)該是innerHTML,而文本框text后面跟的應(yīng)該是value。兩者各有所長。div對象內(nèi)可以顯示圖片，控件等各種內(nèi)容，不限于文字。而text的優(yōu)點則在于它不僅僅可以輸出顯示內(nèi)容，也可以讓用戶在文本框里輸入內(nèi)容，以供提取。4.創(chuàng)建頁面，使得用戶在前三項文本框中輸入姓名，籍貫，性別后，單擊按鈕，則最后一個文本框中出現(xiàn)一句話，內(nèi)容為“xx你好，你來自*，你是個男生/女生”其中xx，*，性別內(nèi)容要取決于用戶輸入的內(nèi)容。5.創(chuàng)建頁面，使其點擊按鈕時在div和文本框text中同時出現(xiàn)你自己的姓名，班級或輔導(dǎo)員名字。6. 以下代碼目前功能是點擊按鈕會在div中出現(xiàn)對應(yīng)答案。請修改頁面代碼使其實現(xiàn)功能為，點擊按鈕的時候，文本框text會和div一起顯示對應(yīng)答案。 郭峰function a(x)document.getElementById(c).innerHTML=x;你屬于哪一種上班族？當你流落荒島時，饑寒交迫，你會以哪種捕食方式快速喂飽自己設(shè)計抓山雞 采椰子 在岸邊捕魚 捕獵野豬 實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗五 Javascript中text控件的設(shè)計練習(xí)實驗?zāi)康?.熟悉text控件的基本代碼。2.掌握javascript中text與其他控件的組合用法。3.掌握text與function組合使用的常見用法。實驗內(nèi)容1. 請設(shè)計一個頁面，包括一個文本框，四個按鈕。四個按鈕的value分別是“我的姓名”“我的性別”“我的愛好”“我的家鄉(xiāng)”。點擊按鈕，則在文本框中會顯示相應(yīng)信息。注意：我要求你本題中四個按鈕要使用同一個function。換句話說，這個題目必須用傳遞參數(shù)技術(shù)來完成。2. 創(chuàng)建一個包含一個文本框和四個按鈕的頁面。要求點擊按鈕的時候在文本框中出現(xiàn)對應(yīng)文字。而且要求本題目四個按鈕必須使用同一個function，也就是說必須使用參數(shù)傳遞技術(shù)。四個按鈕點擊后在文本框中出現(xiàn)的對應(yīng)文字為：俞敏洪推薦語：開卷不讀薛氏書，縱談教育也枉然。小巫推薦語：他是要您懂得培養(yǎng)孩子之道，人生成長之道。徐小平推薦語：他的文字與思想已經(jīng)并將繼續(xù)對中國社會產(chǎn)生重要影響。 南方人物周刊推薦語：助你自信充盈，找到正確的出口。唯有青春，不可辜負！3. 請參考并輸入課本p32程序清單3.3的全部代碼，觀察運行結(jié)果。注意/右側(cè)的注釋性代碼不必輸入。4. 完成課本p33的練習(xí)3.9.這個題目中必須用到parseInt（）函數(shù)。因為我們經(jīng)常用到文本框，而文本框中的默認類型為字符型，而有時候我們需要將其作為數(shù)值進行運算，那么我們就必須將其通過parseInt（）函數(shù)轉(zhuǎn)為數(shù)值型后再運行代碼。假設(shè)現(xiàn)在是X攝氏度，那么轉(zhuǎn)換為華氏度的公式為(x*9)/5)+32那么怎么讓第一個文本框的值為x呢？常見做法是var x=document.getElementById(t1).value;那么怎么把它轉(zhuǎn)為數(shù)值型呢？只要加上函數(shù)即可。(parseInt(x)*9)/5)+325. 下面頁面主要介紹了parseInt()函數(shù)。它的功能是讓字符串轉(zhuǎn)為數(shù)值型。你可以看上面的兩個按鈕，代碼完全一樣，唯一的區(qū)別是一個加了parseInt（）函數(shù)而另外一個沒有。接下來請在本頁面內(nèi)作出修改，實現(xiàn)如下功能：請增加2個button，其value值分別為相減，相乘；而這兩個按鈕的功能分別是點擊之后，在其后的文本框中出現(xiàn)文本框t1，t2相減、相乘的結(jié)果。 郭峰function f2()var x=document.getElementById(t1).value;var y=document.getElementById(t2).value;document.getElementById(t4).value=parseInt(x)+parseInt(y);function f1()var x=document.getElementById(t1).value;var y=document.getElementById(t2).value;document.getElementById(t3).value=(x)+(y);+實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗六 Javascript中函數(shù)的簡單應(yīng)用實驗?zāi)康?熟悉javascript語言的函數(shù)基本結(jié)構(gòu)。2會定義函數(shù)及其參數(shù)變量。3熟悉對函數(shù)的一些基本操作和具體的函數(shù)定義。實驗內(nèi)容1.設(shè)計一個頁面，要求頁面內(nèi)有三個文本框，4個按鈕。四個按鈕上分別是、,而點擊某個按鈕之后，則會將前兩個文本框中的數(shù)字進行相應(yīng)的數(shù)學(xué)運算，把答案顯示在第三個文本框中。2.設(shè)計一個頁面，要求實現(xiàn)功能為：a.點擊對應(yīng)按鈕，則在其后的文本框中出現(xiàn)對應(yīng)答案?？疾禳c是parseInt()函數(shù)的應(yīng)用。b.給每個算式等號左邊的文本框中設(shè)置一個默認值。就是要求每個text都要在代碼中先設(shè)一個value。c.小提示:我只給出了加法的按鈕對應(yīng)的代碼，我建議你復(fù)制粘貼這段代碼來實現(xiàn)功能，但是要注意讓按鈕和function，以及各個文本框之間的對應(yīng)關(guān)系。3.設(shè)計一個頁面，要求單擊左邊文本框?qū)?yīng)按鈕，則左邊文本框中會出現(xiàn)對應(yīng)文字。比如依次單擊6,5,7，則出現(xiàn)657。右邊文本框及對應(yīng)按鈕的功能也類似。在輸入數(shù)字完畢后，單擊=按鈕，則第三個文本框中會出現(xiàn)左邊兩個文本框中的相加之和。本題目是一個簡化的計算器。我給出的提示是，本題中建議只采用三個function。左邊文本框?qū)?yīng)數(shù)字按鈕都用一個function足矣，右邊的則用另外一個按鈕function，=等號單獨用一個function。4.設(shè)計一個網(wǎng)頁，其上的文字為“測試你倆的緣分 三分測試你倆的緣分 三分鐘就知道誰是你最愛得人? (98%的準確率) ” 然后下面有這樣兩句您的名字是？后面設(shè)計個文本框。然后下面是這一句寫下一個異性的名子. 后面再一個文本框然后后面是個按鈕，開始測試點擊開始測試之后，頁面會有這樣的提示：哈哈，某某，我已經(jīng)知道你喜歡的人是某某啦。趕快賄賂賄賂我，讓我?guī)湍惚Ｃ馨桑∵@個題目主要是復(fù)習(xí)button的onclick與alert結(jié)合的一個題目。5. 請創(chuàng)建頁面輸入如下代碼，本題目我已經(jīng)給出了前三個按鈕的代碼，請為第四個按鈕增添代碼，使得單擊第四個按鈕的時候，第二個文本框中出現(xiàn)1+3+數(shù)值型t1的值的結(jié)果。郭峰function f1(x,y)document.getElementById(t2).value=document.getElementById(t1).value+x+y;function f2(x,y)document.getElementById(t2).value=1+x+y;初始值t1 最終值t2 實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗七 Javascript控件交互設(shè)計實驗?zāi)康?.熟悉text與button的組合應(yīng)用。2.會定義function的相關(guān)功能。3.試驗較復(fù)雜功能的頁面設(shè)計。實驗內(nèi)容1. 請完成以下網(wǎng)頁的設(shè)計，要求用戶在輸入姓名后，單擊相應(yīng)按鈕，下面就會出現(xiàn)一個對應(yīng)的請假單。并且附帶用戶的姓名和當天日期。日期由Date（）函數(shù)得出。得到具體年月日的函數(shù)請看課本P303。請假單顯示在一個id為d1的div中。再說一點，這個題目如果你使用參數(shù)傳遞的思路來解決的話，那么只需用寫一個function即可足夠使用了。2.請為如下頁面增加代碼，要求實現(xiàn)效果為：用戶輸入姓名，并在空缺文本框中輸入答案后，單擊提交答案按鈕，則會告訴用戶最終得分。每作對一題25分，滿分一百分。郭峰function f1()var x=document.getElementById(t1).value;var y=document.getElementById(t2).value;document.getElementById(t3).value=parseInt(x)+parseInt(y);請在此輸入您的姓名： 請在下面的文本框內(nèi)輸入您的答案： = = = = 實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗八 新函數(shù)的學(xué)習(xí)與應(yīng)用訓(xùn)練實驗?zāi)康?.介紹了parseInt（）這個函數(shù)以及text文本框的value默認值功能，并重新練習(xí)了button的onclick調(diào)用function來實現(xiàn)代碼功能的頁面結(jié)構(gòu)。2.掌握innerHTML和Math.random()隨機數(shù)函數(shù)。3.confirm（）與prompt（）是我們要練習(xí)的新知識。刷新頁面location.reload()也是一個我們必須了解的常用函數(shù)。4.我們今天的重點是4.7利用math對象簡化運算中4.7.1取整和4.7.3隨機數(shù)。這兩個知識點的組合可以衍生出很多不同的效果。是我們會經(jīng)常用到的。實驗內(nèi)容1. 請設(shè)計一個頁面，頁面中有三個按鈕，要求單擊每個按鈕的時候，則在對應(yīng)位置出現(xiàn)你自己的姓名。單擊文本框按鈕，則文本框中要出現(xiàn)你的名字，也就是onclick點擊按鈕之后，通過函數(shù)function，使得text的value值為你的名字。單擊alert按鈕，則彈出一個alert警告框，里面是你的名字。最后是div按鈕，單擊它則div中的內(nèi)容換成你的名字，也就是這個div對應(yīng)id的document.getElementById().innerHTML=你的名字2. confirm的功能是彈出一個兩選項的對話框，最重要的是，你點擊確定或者取消按鈕之后，可以給出進一步的選擇。請創(chuàng)建頁面，要求是，修改本題的代碼，使其功能為：單擊按鈕，會彈出一句話：“你今天的心情是不是很好?。俊比绻脩酎c擊確定，則彈出“那你請我吃飯好不好?。俊比绻脩酎c擊取消，則彈出“那你是不是因為我沒給你機會請我吃飯所以心情不好??？”3.自己創(chuàng)建一個文件，復(fù)制任務(wù)2的代碼，然后自己編寫程序，要求頁面一開始彈出一個confirm，然后用戶點擊確定或者取消之后，會再分別彈出內(nèi)容不同的alert。4. 設(shè)計網(wǎng)頁，實現(xiàn)的功能為：點擊確定之后再出現(xiàn)一個confirm，看用戶是否點擊兩次確定。如果點擊取消，則以alert結(jié)束。要求：修改代碼，實現(xiàn)如下功能：一開始confirm提問：你是否喜歡紅色？如果用戶點擊確定，則再一個confirm：你是否喜歡藍色？如果用戶點擊確定，則彈出“你喜歡紅色和藍色”如果用戶點擊取消，則彈出“你喜歡紅色不喜歡藍色”如果在“你是否喜歡紅色？”那個問題上用戶選擇了取消，則再一個confirm是“你是否喜歡黃色？”如果用戶點擊確定，則彈出“你喜歡黃色不喜歡紅色”如果用戶點擊取消，則彈出“紅色和黃色你都不喜歡”5. 提示框經(jīng)常用于提示用戶在進入頁面前輸入某個值。當提示框出現(xiàn)后，用戶需要輸入某個值，然后點擊確認或取消按鈕才能繼續(xù)操縱。如果用戶點擊確認，那么返回值為輸入的值。如果用戶點擊取消，那么返回值為 null。也就是如果點擊取消則沒有任何反應(yīng)。語法： prompt(文本,默認值)這里的文本是這個對話框上方彈出的提示語。這里的默認值是對話框剛打開的時候默認出現(xiàn)在對話框里的內(nèi)容。創(chuàng)建頁面，要求實現(xiàn)功能： title改成你自己的名字。最終效果為：當用戶輸入自己名字后，頁面提示為“XX，成功學(xué)院歡迎你的到來！”xx是用戶自己輸入的名字。6.創(chuàng)建頁面，包括一個文本框一個按鈕，使其最終效果為：當用戶輸入自己性別后，如果輸入為“男”，則頁面顯示“先生你好”，如果輸入為“女”，則顯示“女士你好“。7. 頁面打開之后，會直接出現(xiàn)提示框，第一個提示框是請用戶輸入自己的姓名，第二個提示框是請用戶輸入性別為“男”或者“女”。根據(jù)用戶輸入的信息，頁面顯示“XX先生你好”或者“XX女士你好”。這里的xx是用戶在第一個prompt提示框中自己輸入的名字。實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗九 div與text的顯示應(yīng)用練習(xí)實驗?zāi)康?.nerHTML的靈活應(yīng)用2.v與text的顯示應(yīng)用3.lue與innerHTML的區(qū)別于練習(xí)實驗內(nèi)容1. 本題目是練習(xí)課本P36的4.2的內(nèi)容，通過id訪問元素，并通過innerHTML屬性改變其內(nèi)容。題目要求為，用戶在文本框中輸入自己的名字，單擊按鈕，則頁面的div中出現(xiàn)一句話“XX,你今天心情好么？”xx是用戶在文本框中輸入的名字。文本框中默認值為你自己的姓名。 這個題目比較容易，我再強調(diào)一下里面涉及的知識點：div要顯示內(nèi)容應(yīng)該把div對應(yīng)id的innerHTML屬性設(shè)置為你需要顯示的內(nèi)容即可。比如document.getElementById(注意這里要輸入div的id).innerHTML=你的名字 而文本框的值則由這句經(jīng)典代碼來指代。document.getElementById(文本框的id).value 他們的相同點是都要用到document.getElementById，都要在括號內(nèi)的引號中輸入id。區(qū)別是div后面跟的是innerHTML,而text文本框后面跟的是value。2. 本題目要求為，設(shè)計頁面代碼，在頁面內(nèi)增加一個文本框，文本框內(nèi)默認值為10。當用戶單擊第一個按鈕的時候，則文本框中依次出現(xiàn)10,20,40，80.就是前一個數(shù)的倍數(shù)。而單擊第二個按鈕，則刷新頁面，重置文本框的值。 這個題目比較容易，我再強調(diào)一下里面涉及的知識點：div要顯示內(nèi)容應(yīng)該把div對應(yīng)id的innerHTML屬性設(shè)置為你需要顯示的內(nèi)容即可。比如document.getElementById(注意這里要輸入div的id).innerHTML=你的名字3. Math.random()是一個從0到1的隨機數(shù)。那么如果我想得到從0到10的隨機數(shù)呢？那么就需要我們讓Math.random()*10就可以了。然后通過四舍五入，就能得到一個從0到10的隨機整數(shù)。任務(wù)9的要求是創(chuàng)建一個頁面，頁面內(nèi)有一個按鈕和一個文本框。單擊按鈕的時候文本框中隨機出現(xiàn)一個0到10隨機數(shù)。建議從我的示范頁面中選擇和復(fù)制代碼來完成。4.請把以下代碼復(fù)制到空文檔中，用瀏覽器打開，然后按要求修改代碼實現(xiàn)功能。 文本框賦初值和單擊清空。function a()document.getElementById(t1).value=Math.round(Math.random()*99+1);function b()document.getElementById(t1).value=;function c()function d()本頁面的A,B按鈕已經(jīng)具備了相應(yīng)功能。請學(xué)習(xí)其代碼，然后對C,D按鈕輸入js代碼，使其實現(xiàn)頁面上要求的功能。 現(xiàn)在是時分 秒單擊此按鈕，則上面第一個文本框中會出現(xiàn)一個隨機數(shù)單擊此按鈕，會清空第一個文本框中的數(shù)值單擊此按鈕，則上面的第二，三，四個文本框會出現(xiàn)隨機數(shù)。這里特別提醒一下，第二個文本框是出小時，那么應(yīng)該是從0到23的隨機數(shù)，而文本框三，四是分和秒，它應(yīng)該是從0到59的隨機數(shù)。單擊此按鈕，則上面的第二，三，四個文本框中的隨機數(shù)會被清空。實驗步驟1.創(chuàng)建網(wǎng)頁文檔文件；2.在編輯器中打開文檔，輸入代碼；3.在瀏覽器中觀看代碼效果；4.根據(jù)運行情況進行調(diào)試；5.根據(jù)最終結(jié)果記錄程序，總結(jié)經(jīng)驗。實驗數(shù)據(jù)記錄及分析（或程序及運行結(jié)果）評語：分數(shù)： 教師簽字： 日期： 年 月 日實驗十 Javascript程序修改練習(xí)實驗?zāi)康?.javascript代碼閱讀能力2.根據(jù)源代碼進行改進的能力。實驗內(nèi)容1.請把以下代碼復(fù)制到空文檔中，用瀏覽器打開，然后按要求修改代碼實現(xiàn)功能。郭峰function a()function b()在此頁面基礎(chǔ)上進行代碼修改，使得下面的A,B按鈕可以完成相應(yīng)的運算功能。 + = - =單擊此按鈕，則上面四個式子的等號左側(cè)文本框中會隨機出現(xiàn)0到100之間的整數(shù)單擊此按鈕，則上面四個式子的等號左側(cè)文本框中會隨機出現(xiàn)0到100之間的整數(shù)，并且最右邊的文本框中會出現(xiàn)他們的計算結(jié)果。2. 請把以下代碼復(fù)制到空文檔中，用瀏覽器打開，然后按要求修改代碼實現(xiàn)功能。郭峰function a()請在此輸入您的姓名： 要求單擊此按鈕后，下面文本框中出現(xiàn)一句話：“恭喜xxx！我們已經(jīng)測試出您的幸運數(shù)字為y”。xxx為上面文本框中輸入的名字，y是一個從0到100的隨機整數(shù)。 實驗步