Web程序設(shè)計基礎(chǔ)實驗教案.doc

本 課 程 教 學(xué) 總 體 安 排課 程 名 稱：Web程序設(shè)計基礎(chǔ)（實驗）課程性質(zhì)與類型：專業(yè)基礎(chǔ)課+必修總學(xué)時、學(xué)分：32學(xué)時，1學(xué)分教學(xué)目的與要求：該實驗課附屬Web程序設(shè)計基礎(chǔ)，是課堂教學(xué)的補充，主要以實踐環(huán)節(jié)教學(xué)為主，通過實驗使學(xué)生更好地掌握HTML基礎(chǔ)知識、ASP.NET基礎(chǔ)知識、ASP.NET服務(wù)器控件、頁面切換與導(dǎo)航、頁面布局、ADO.NET數(shù)據(jù)訪問、ASP.NET中的數(shù)據(jù)綁定等技術(shù)，使學(xué)生掌握ASP.NET網(wǎng)站開發(fā)方法和Web應(yīng)用程序的技術(shù)。教材及參考書目：教材：ASP.NET 3.5 網(wǎng)站開發(fā)實例教程 陳偉、衛(wèi)琳 清華大學(xué)出版社 參考書目：1. ASP.NET網(wǎng)頁設(shè)計與網(wǎng)站開發(fā) 馬俊等 人民郵電出版社 2007.6 2. c# & ASP.NET鄭淑芬等 中國青年出版社 2001.8考核方式及成績計算方法：考核方式：考查總成績=平時成績*20%+期末成績*80%+實驗成績*10%課 程 教 學(xué) 日 歷課程名稱：Web程序設(shè)計基礎(chǔ)（實驗） 學(xué)期：2013-2014學(xué)年第二學(xué)期周次章節(jié)及教學(xué)內(nèi)容累計學(xué)時1ASP.NET與VWD 2005開發(fā)平臺22XHTML基礎(chǔ)知識23XHTML基礎(chǔ)知識24ASP.NET 基礎(chǔ)知識25ASP.NET 基礎(chǔ)知識26ASP.NET 服務(wù)器控件27ASP.NET 服務(wù)器控件28ASP.NET 服務(wù)器控件29頁面切換與導(dǎo)航210頁面切換與導(dǎo)航211頁面布局212頁面布局213ADO.NET數(shù)據(jù)訪問214ADO.NET數(shù)據(jù)訪問215ASP.NET中的數(shù)據(jù)綁定216ASP.NET中的數(shù)據(jù)綁定2實驗一 ASP.NET與VWD 2005開發(fā)平臺實驗名稱：ASP.NET與VWD 2005開發(fā)平臺實驗時數(shù)： 2學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）安裝ASP.NET的開發(fā)環(huán)境VWD 2005（2）熟悉VWD 2005開發(fā)環(huán)境（3）創(chuàng)建簡單的動態(tài)網(wǎng)站。實驗內(nèi)容：（1）安裝VWD 2005，建立ASP.NET的運行環(huán)境。（2）使用VWD 2005創(chuàng)建網(wǎng)站lianxi1，并創(chuàng)建第一個頁面exam1.aspx（3）單擊頁面exam1.aspx的設(shè)計標(biāo)簽，切換到頁面設(shè)計窗口，在頁面中鍵入：“這是我的第一個ASP.NET程序”。（4）運行這個頁面。 實驗二 XHTML基礎(chǔ)知識實驗名稱：XHTML基礎(chǔ)知識實驗時數(shù)： 4學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求： （1）熟悉并會使用XHTML的頁面格式及語法規(guī)則（2）掌握XHTML文本標(biāo)記、列表標(biāo)記、表格標(biāo)記、圖像標(biāo)記、超鏈接標(biāo)記等標(biāo)記的使用。實驗內(nèi)容：(1) 創(chuàng)建一個XHTML頁面 rumengling.aspx，結(jié)果如圖所示：(2) 練習(xí)列表標(biāo)記songci.aspx，輸出結(jié)果如圖所示：(3) 用XHTML語言編寫符合以下要求的頁面：標(biāo)題為“An example of image”，在瀏覽器窗口中顯示一個圖像。圖像的寬度為200個像素點，高度為150個像素點，邊框?qū)挾葹?0個像素點。 (4) 在網(wǎng)頁中做一張課程表，要求所有的文字均居中，背景為黃色，表格居中，寬度為500像素。單元格間距與單元格邊距為20像素。（5）創(chuàng)建一個網(wǎng)頁，通過鏈接可以跳轉(zhuǎn)到（1）創(chuàng)建的rumengling.aspx上。實驗三 ASP.NET 基礎(chǔ)知識實驗名稱：ASP.NET 基礎(chǔ)知識實驗時數(shù)： 4學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）了解ASP.NET頁面的運行機(jī)制和配置文件管理方式（2）熟練掌握ASP.NET各種對象的使用方法。實驗內(nèi)容：(1) 編寫程序，實現(xiàn)讓用戶輸入兩個整數(shù)，并使用一個按鈕進(jìn)行數(shù)據(jù)提交，使用Request對象來得到用戶提交的數(shù)據(jù)，比較Get和Post方法的不同。(2) 編寫程序，使用Response對象的Write，Redirect，End方法。(3) 編寫程序，利用Session保存用戶輸入的信息，并在頁面上顯示。(4) 編寫程序，使用Cookie記錄用戶名，并在頁面上顯示出來。(5) 利用Application對象實現(xiàn)網(wǎng)站訪問量統(tǒng)計。實驗四 ASP.NET 服務(wù)器控件實驗名稱：ASP.NET 服務(wù)器控件實驗時數(shù)： 6學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）熟悉用戶控件的創(chuàng)建技術(shù)，掌握用戶控件的屬性、事件、方法的定義和使用。（2）學(xué)會利用自定義用戶控件制作導(dǎo)航條和用戶登錄控件。實驗內(nèi)容：（1）新建名字為ServerControlExperiment網(wǎng)站。（2）在default.aspx頁面中，添加1個TextBox控件、2個Button控件、一個ListBox控件，如圖所示。將2個Button控件的Text屬性分別改為“增加”和“刪除”。當(dāng)單擊【增加】按鈕時，將TextBox文本框中的輸入值添加到ListBox中，但單擊【刪除】按鈕時，刪除ListBox中當(dāng)前選定項。（3）添加一個網(wǎng)頁，要求將Label控件、LinkButton控件、HyperLink控件放在Panel控件中，當(dāng)單擊一組Button按鈕時改變Panel控件的背景色，單擊另一組Button控件時改變Panel控件中文字的大小。單擊LinkButton和HyperLink控件時分別導(dǎo)航到新的網(wǎng)頁或網(wǎng)站。單擊RadioButton控件時隱藏Panel控件，單擊另一個RadioButton控件時顯示Panel控件。如圖所示。（4）添加一個網(wǎng)頁，在MultiView控件添加3個View控件，在每個View控件中各添加Image控件，再添加3個RadioButton控件切換各個View視圖，每個View視圖顯示不同的圖像。（5）添加一個網(wǎng)頁，在頁面中添加AdRotator控件，鏈接XML廣告數(shù)據(jù)源，實現(xiàn)廣告圖像顯示，當(dāng)單擊廣告圖像時導(dǎo)航到相應(yīng)的網(wǎng)頁。（6）添加一個網(wǎng)頁，在頁面中添加CheckBoxList控件，單擊Button按鈕時將CheckBoxList的選項寫到ListBox中。（7）添加一個網(wǎng)頁，在頁面中添加RadioButtonList控件，單擊Button按鈕時將CheckBoxList的選項寫到ListBox中。（8）添加一個網(wǎng)頁，選擇DropDownList控件的選項時導(dǎo)航到相應(yīng)的網(wǎng)站。（9）添加一個網(wǎng)頁，在頁面中添加TextBox、RequiredFiledValidator和CompareValidator控件，實現(xiàn)CompareValidator控件的Operator行為的Equal、GreaterThan等屬性值得驗證。實驗五 頁面切換與導(dǎo)航實驗名稱：頁面切換與導(dǎo)航實驗時數(shù)： 4學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）熟悉頁面切換和網(wǎng)站導(dǎo)航的常用方法，掌握利用超鏈接、按鈕的PostBackUrl屬性、Response.Redirect和Server.Transfer屬性實現(xiàn)從一個頁面切換到另一個頁面的方法（2）熟練利用SiteMapPath、Menu和TreeView控件實現(xiàn)網(wǎng)站導(dǎo)航。實驗內(nèi)容：（1）新建一個名為“Pages_Exercise”的應(yīng)用程序。（2）添加一個名為“Home.aspx”的主網(wǎng)頁。（3）添加一個網(wǎng)頁“Page1.aspx”，利用超鏈接實現(xiàn)從Home.aspx切換到此網(wǎng)頁。（4）添加三個網(wǎng)頁“Page2.aspx”，“Page3.aspx”，“Page4.aspx”分別利用Button、LinkButton和ImageButton控件的PostBackUrl屬性實現(xiàn)網(wǎng)頁切換。（5）添加兩個網(wǎng)頁“Page5.aspx”，“Page6.aspx”，分別利用Response.Redirect對象傳遞數(shù)據(jù)的方法實現(xiàn)從“Page2.aspx”傳遞數(shù)據(jù)到“Page5.aspx” 和Server.Transfer對象傳遞數(shù)據(jù)的方法實現(xiàn)從“Page3aspx”傳遞數(shù)據(jù)到“Page6.aspx”。（6）利用站點地圖和SiteMapPath導(dǎo)航控件實現(xiàn)從Home.aspx到“Page1.aspx”， “Page2.aspx”，“Page3.aspx”，“Page4.aspx”網(wǎng)站導(dǎo)航。（7）在網(wǎng)頁“Home.aspx”中，利用Menu控件實現(xiàn)自定義導(dǎo)航。（8）在網(wǎng)頁“Page_1.aspx”中，利用TreeView控件實現(xiàn)自定義導(dǎo)航。實驗六 頁面布局實驗名稱：頁面布局實驗時數(shù)： 4學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）熟悉層的應(yīng)用，掌握層的布局，（2）掌握母版頁的創(chuàng)建及使用方法，能夠通過創(chuàng)建母版頁來實現(xiàn)導(dǎo)航頁面的設(shè)計 。實驗內(nèi)容：（1）新建一個名為CRM的網(wǎng)站（2）在【解決資源管理器】中右擊網(wǎng)站的名稱，然后單擊【添加新項】，添加母版頁Master1（3）在母版頁Master1中，刪除ContentPlaceHolder控件，插入四個層。     版權(quán)所有，違者必究 （4）分別設(shè)置每個層的CSS樣式。（5）添加內(nèi)容頁。（6）瀏覽網(wǎng)頁如圖所示效果。（7）定義兩個主題，利用主題實現(xiàn)換膚。實驗七 ADO.NET數(shù)據(jù)庫訪問 實驗名稱：ADO.NET數(shù)據(jù)庫訪問實驗時數(shù)： 4學(xué)時授課類型：實驗課教學(xué)方法與手段：指導(dǎo)目的要求：（1）熟悉ADO.NET數(shù)據(jù)庫訪問技術(shù)，（2）掌握Command和DataAdapter對象操作數(shù)據(jù)庫數(shù)據(jù)的方法。實驗內(nèi)容：（1）新建名字為“Accessdatabase_ Exercise”的網(wǎng)站。（2）在網(wǎng)站的App_Data文件夾中，建立數(shù)據(jù)庫“MyDatabase_ Exercise.mdf”。（3）在該數(shù)據(jù)庫中建立一張職工表，并且添加一些模擬的職工記錄。其關(guān)系模式如下：Employees（ID，NAME，SEX，AGE，Date of work，F(xiàn)ilename of Photo）（4）在web.config配置文件中，修改“”標(biāo)記如下。（5）添加一個網(wǎng)頁，利用Command對象實現(xiàn)新職工的錄入。（6）添加一個網(wǎng)頁，利用Command對象實現(xiàn)刪除指定編號的職工記錄。（7）添加一個網(wǎng)頁，利用Command對象實現(xiàn)修改指定編號的職工信息。（8）添加一個網(wǎng)頁，利用DataAdapter對象實現(xiàn)查詢職工信息，并顯示到網(wǎng)頁的Label控件上。 實驗八 ASP.NET中的數(shù)據(jù)綁定實驗名稱：ASP.NET中的數(shù)據(jù)綁定實驗時數(shù)：