《Web程序設計》實驗指導書_第1頁
《Web程序設計》實驗指導書_第2頁
《Web程序設計》實驗指導書_第3頁
《Web程序設計》實驗指導書_第4頁
《Web程序設計》實驗指導書_第5頁
已閱讀5頁，還剩14頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

1、Web程序設計實驗課程課程編號：433013實 驗 指 導 書主撰人： 審核人：經濟與管理科學系電子商務教研室二一二 年四月 目 錄前 言1實驗1搭建ASP開發環境2實驗2Dreamweaver編寫頁面5實驗3超文本標記語言HTML7實驗4VBScript編程9實驗5ASP內置對象的使用（一）11實驗6ASP內置對象的使用（二）13實驗7ADO組件的使用15前 言實驗總體目標:培養Web程序設計編程能力適用專業年級:電子商務三年級第五學期實驗課時分配:24學時序號實驗項目要求類型每組人數實驗學時1搭建ASP開發環境選驗證122Dreamweaver編寫頁面必驗證123超文本標記語言HTML必綜

2、合144VBScript編程必設計145ASP內置對象的使用必設計146ASP內置組件的使用（一）必綜合147ASP內置組件的使用（二）必設計14實驗環境要求每次可提供每人一臺正常運行的計算機，實驗室面積為60平方米以上，多媒體投影系統，室內采光通風良好衛生，供電正常，無強大信號干擾源，消防設備齊全，疏散通道正常。實驗總體要求通過本實驗課程的教學，學生能基本上達到獨立完成實驗內容，通過老師的指導可完成研究性實驗內容，能將相關內容應用到課程設計、電子競賽、畢業設計等實踐性環節中。本課程的重點、難點及教學方法建議1、重點: 掌握ASP開發平臺的搭建；掌握HTML語言編寫網頁；掌握ASP的工作原理及

3、其編程；熟練掌握VBScript程序的編寫；熟練使用ASP內置對象編程；熟練使用ASP內置組件編程；熟練掌握通過ADO訪問數據庫的編程。2、難點：掌握ASP內置對象編程；掌握通過ADO訪問數據庫的編程。3、教學方法建議：注重理論與實驗相結合，可利用現有的實驗條件開發不同方法的綜合性、設計性及研究性實驗內容或實驗項目。實驗1 搭建ASP開發環境一、實驗目的1、掌握使用IIS作為WEB服務器進行ASP頁面發布的方法2、掌握使用ASP腳本進行基本輸出的方法二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理1、利用Windows組件IIS搭建Web服務器實現對ASP頁面的解析。2、利用簡單

4、ASP頁面的運行檢測IIS工作是否正常。四、實驗內容與步驟1、安裝IIS（因實驗室微機已安裝IIS，本步驟無須上機完成）；將WindowsXP安裝光盤放入光驅（或將安裝光盤下I386文件夾拷貝至硬盤中）。啟動控制面板中的“添加或刪除程序”。圖1-1 添加/刪除程序在彈出的對話框中點擊左側的“添加/刪除Windows組件”按鈕，在彈出的Windows組件向導中，選中Internet信息服務（IIS），如下圖：圖1-2 Windows組件向導點擊“下一步”。若I386文件夾與安裝是所處位置不同，則會彈出如下對話框：圖1-3 所需文件對話框在此對話框中輸入I386文件夾的真實路徑，點擊“確定”可繼續

5、完成安裝。（此對話框在安裝過程中可能出現多次）2、設定WEB主目錄主目錄是存放WEB服務器頁面的初始目錄，只有此目錄下的文件才能被客戶訪問。默認的主目錄一般為c:inetpubwwwroot，您也可以按圖所示來更改主目錄。圖1-4 默認網站屬性對話框3、設置默認文檔 接下來，為您的主目錄設置一個能在默認情況下自動運行的文檔。該文檔的作用是，當進入本站點時，如沒有指定要訪問的文檔，則服務器自動提供一個默認文檔讓其訪問。在圖中，選中“啟用默認文檔”復選框，并在“默認文檔”框中，輸入自己的首頁文檔名index.asp。圖1-5 默認文檔設置頁面4、建立簡單ASP頁面使用記事本新建一個文檔，向文檔中輸

6、入如下內容：<html><head><title>Hello World</title></head><body><% response.write “Hello World!” %></body></html>將該文檔保存到您上面所指定的WEB主目錄下，文件名為您指定的默認文檔名稱：index.asp。打開瀏覽器，在地址欄內輸入您的WEB站點地址（這里使用localhost做為本機地址），然后按回車鍵即可查看到默認文檔的內容了。五、思考題1、若要查看的目錄下沒有默認文檔將出現什么結果？

7、2、對于靜態頁面，Web服務器如何處理？六、注意事項1、注意Web主目錄與頁面存放文件夾及訪問URL之間的關系。實驗2 Dreamweaver編寫頁面一、實驗目的1、掌握利用Dreamweaver制作靜態頁面的方法；2、掌握利用Dreamweaver制作ASP頁面的方法；二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理1、利用Dreamweaver制作靜態頁面；2、利用Dreamweaver制作簡單ASP頁面。四、實驗內容與步驟1、利用Dreamweaver制作靜態頁面啟動Dreamweaver，在創建新項目中單擊HTML，創建一個靜態HTML頁面。圖2-1 Dreamweave

8、r啟動界面制作一個簡單靜態頁面如下圖。圖2-2 靜態頁面按F12，在瀏覽器中預覽此頁面效果。2、利用Dreamweaver制作簡單ASP頁面。打開Dreamweaver，在創建新項目下單擊ASP VBScript，創建一個ASP頁面。（參見圖2-1）在代碼模式下，輸入代碼。部分代碼如下：<body>現在的時間是：<%=now()%></body>3、創建站點并預覽將IIS的Web主目錄設置為C:Inetpubwwwroot，創建新站點，將此站點的本地根文件夾設置為此目錄。將此站點測試服務器設置如下圖2-4。圖2-3 站點本地信息設置圖2-4 站點測試服務器設

9、置將新建的ASP頁面保存于C:Inetpubwwwroot目錄中。按F12預覽。五、思考題1、客戶端能否看見ASP腳本的內容？2、對于動態ASP頁面，Web服務器如何處理？六、注意事項1、注意Web主目錄與頁面存放文件夾及訪問URL之間的關系。實驗3 超文本標記語言HTML一、實驗目的1、掌握Dreamweaver中編寫HTML標簽的方法；2、掌握常用HTML標簽的使用。二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理1、在Dreamweaver中新建頁面，轉到代碼模式下對其HTML源代碼進行編輯；2、在頁面源代碼中輸入常用HTML標簽，轉到預覽模式下查看其顯示效果。四、實驗內容

10、與步驟1、在Dreamweaver中新建頁面，轉到代碼模式下對其HTML源代碼進行編輯啟動Dreamweaver，在創建新項目中單擊HTML，創建一個靜態HTML頁面。圖3-1 Dreamweaver啟動界面在Dreamweaver中轉到代碼模式下，輸入如下HTML代碼：圖3-2 代碼模式頁面轉到設計模式，預覽此頁面效果。2、在頁面源代碼中輸入常用HTML標簽，轉到預覽模式下查看其顯示效果。在代碼模式下，在文字頭尾分別輸入HTML標簽<b></b>，<u></u>，<p></p>，<br>,<hr>

11、等，每輸入一個標簽就轉到設計模式查看此標簽對頁面顯示的效果影響。在設計模式下，對文字的字體，字號，顏色，超鏈接等進行設置。每次設置后，轉到代碼模式查看此效果由哪些HTML標簽體現。五、思考題1、在設計模式下對文字進行設置和在代碼模式下直接編輯HTML標簽來指定輸出效果有沒有區別？六、注意事項1、在Dreamweaver中，編輯->首選參數打開首選參數對話框，將其中“使用CSS而不是HTML標簽”選項前的勾去掉。（下圖中紅色圓角矩形框中的選項）圖3-3 首選參數對話框實驗4 VBScript編程一、實驗目的1、掌握在頁面中加入VBScript腳本的方法；2、掌握客戶端VBScript程序的

12、編寫；二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理1、通過VBScript腳本的編寫，熟悉VBScript語法與程序的編寫。四、實驗內容與步驟1、新建網頁，在代碼模式下往頁面中加入VBScript腳本；編寫程序，在頁面上輸出九九乘法表如下圖所示。具體要求：利用表格布局，去掉表格線，增加表格的背景顏色，三角形顯示九九乘法表。圖4-1 九九乘法表打開Dreamweaver，新建ASP頁面。在Dreamweaver中切換到代碼模式，在頁面源代碼中插入如下腳本程序。<html><head><title>九九乘法表</title><

13、/head><body><table border="0"><%for i=1 to 9response.Write("<tr>")for j=1 to iresponse.Write("<td>")response.Write(j&"*"&i&"=")response.Write(i*j)response.Write("</td>")nextresponse.Write(&quo

14、t;</tr>")next%></table></body></html>2、編寫VBScript腳本程序，實現如下程序：在文本框1和文本框2中輸入乘數，點擊等號按鈕后，乘積出現在文本框3中。在Dreamweaver中新建ASP VBScript頁面，在代碼模式下編寫腳本程序，部分代碼如下：<body><script language="vbscript">function answer()document.form1.textfield3.value=document.form1.te

15、xtfield.value*document.form1.textfield2.valueend function</script><form id="form1" name="form1" method="post" action=""> <input name="textfield" type="text" size="5" /> * <input name="textfield2" typ

16、e="text" size="5" /> <input type="button" name="Submit" value="=" onclick="answer()"/> <input name="textfield3" type="text" size="10" /></form></body>圖2-2 代碼模式頁面轉到設計模式，按F12在瀏覽器中預覽此頁面效

17、果。五、思考題1、客戶端的表格是如何形成的？2、客戶端腳本和服務器端腳本有何區別六、注意事項1、注意腳本插入到頁面的方法。實驗5 ASP內置對象的使用（一）一、實驗目的1、掌握Request對象和Response對象的使用；2、掌握Cookies的使用；二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理通過VBScript腳本的編寫，掌握ASP內置對象的使用方法。四、實驗內容與步驟1、利用表單接受用戶輸入，用VBScript語言編寫表單處理程序，利用Request對象接受用戶的輸入，利用Response對象返回應答信息。1)制作表單頁面1.html如下，其中文本框和密碼框名字分別是

18、user和pass，表單動作設置為2.asp。圖5-1 表單頁面1.html2)制作表單處理頁面2.asp。在Dreamweaver中新建ASP VBScript頁面并存為2.asp。轉到代碼模式，在其中輸入表單處理的腳本程序。部分代碼如下：圖5-2 表單處理程序2.asp3)返回1.html頁面，按F12在瀏覽器中預覽1.html頁面，查看程序運行效果。2、編寫腳本實現Cookie的寫入和讀取。編輯上題中1.html，將表單動作設置為3.asp。在Dreamweaver中新建ASP VBScript頁面并存為3.asp。轉到代碼模式，在其中輸入表單處理的腳本程序。部分代碼如下：圖5-3 表單

19、處理程序3.asp五、思考題1、為什么程序中最后要對比user1和user2的值？2、user1和user2的值分別是從何而來？六、注意事項1、HTML信息可以在設計模式下先做好然后再轉到代碼模式添加腳本代碼。實驗6 ASP內置對象的使用（二）一、實驗目的1、掌握Application對象的使用；2、掌握Session對象的使用；二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理通過VBScript腳本的編寫，掌握ASP內置對象的使用方法。四、實驗內容與步驟1、編寫程序，利用Application對象保存信息。1)制作表單頁面1.html如下，其中文本框和密碼框名字分別是user和

20、pass，表單動作設置為2.asp。（可參考上個實驗制作）圖6-1 表單頁面1.html2)制作表單處理頁面2.asp。在Dreamweaver中新建ASP VBScript頁面并存為2.asp。轉到代碼模式，在其中輸入表單處理的腳本程序。部分代碼如下：（可在上個實驗的3.asp基礎上修改）圖6-2 表單處理程序2.asp在瀏覽器中預覽1.html，輸入注冊信息，查看程序運行結果。2、編寫程序，利用Session對象保存信息。編輯上題中1.html，將表單動作設置為3.asp。在Dreamweaver中新建ASP VBScript頁面并存為3.asp。轉到代碼模式，在其中輸入表單處理的腳本程序

21、。部分代碼如下：圖6-3 表單處理程序3.asp五、思考題1、Application對象和Session對象有何不同？2、若不同計算機的用戶同時訪問1.html，表單處理程序2.asp和3.asp的處理結果會否不同？六、注意事項1、注意Application對象和Session對象中數據的寫入和讀取方法。實驗7 ADO組件的使用一、實驗目的1、掌握ADO中connection對象操作數據庫的方法；2、掌握ADO中RecordSet對象的使用。二、實驗設備及要求本實驗主要使用設備為：計算機1臺三、實驗原理通過VBScript腳本的編寫，掌握利用ADO組件中Connection對象和RecordS

22、et對象訪問數據庫的方法。四、實驗內容與步驟1、編寫腳本，利用Connection對象實現對數據庫的訪問；利用microsoft Access建立數據庫文件asp.mdb，其中包含表格student。此表包含三個字段，No字段自動編號，Name和Sex字段都是文本型，長度為默認的50。在student表中隨意輸入幾條記錄。將此文件保存在C:Inetpubwwwroot目錄中，并在資源管理器中設置其安全權限屬性為everyone都可以完全控制。圖7-1 student表在Dreamweaver中新建ASP VBScript頁面1.asp并保存在C:Inetpubwwwroot目錄中，部分代碼及其

23、解釋如下：<body text="#00FF00" bgcolor="#000000"><p align="center"><font size="6">數據庫操作實例</font></p><hr><table align=center border=2 Width="50%"><%'建立連接字符串connstr ="Provider=Microsoft.Jet.OLEDB.4.0;Dat

24、a Source="&Server.MapPath("Asp.mdb")'建立ADODB.Connection對象Set Conn=Server.CreateObject("ADODB.Connection")'利用ADODB.Connection對象打開數據庫Conn.Open connstr'建立SQL字符串sql="select * from Student"'執行SQL語句并返回結果Set rs=Conn.Execute(sql)'輸出結果while not rs.eo

25、fresponse.write "<TR><TD>"&rs("Name")&"</TD><TD>"&rs("Sex")&"</TD></TR>"rs.MoveNextWend%></table></body>按F12,在瀏覽器中預覽此頁面，看能否顯示student表中所有記錄。2、編寫腳本，利用RecordSet對象實現數據的分頁顯示。在Dreamweaver中新建ASP VBScript頁面2.asp并保存在C:Inetpubwwwroot目錄中，部分代碼如下：<body text="#00FF00" bgcolor="#000000"><p align="center"><font size=5>RecordSet對象實例</font></p><hr><table align=center width=50% border=3><

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論