《WEB程序設(shè)計》教學(xué)大綱

1、WEB程序設(shè)計課程教學(xué)大綱課程代碼：ELBU2007課程性質(zhì)：專業(yè)必修課程授課對象：電子商務(wù)專業(yè)開課學(xué)期：春總 學(xué)時：54學(xué)時 學(xué) 分：2.5學(xué)分講課學(xué)時：36學(xué)時 實驗學(xué)時：18學(xué)時 實踐學(xué)時：0學(xué)時指定教材：徐輝，PHP Web程序設(shè)計教程與實驗，清華大學(xué)出版社，2012年參考書目精通HTML5+CSS3+JavaScript網(wǎng)頁設(shè)計，清華大學(xué)出版社PHP+MySQL+Dreamweaver動態(tài)網(wǎng)站建設(shè)從入門到精通，機械工業(yè)出版社PHP+MySQL+Dreamweaver網(wǎng)站建設(shè)全程揭秘，清華大學(xué)出版社CSS商業(yè)網(wǎng)站布局之道，清華大學(xué)出版社JavaScript入門經(jīng)典，清華大學(xué)出版社教學(xué)目

2、的： PHP是比較普及的互聯(lián)網(wǎng)開發(fā)語言之一，具有開源和免費的獨特優(yōu)勢。MySQL是一個廣受歡迎的中型關(guān)系數(shù)據(jù)庫管理系統(tǒng)，它免費、快速、跨平臺，并且支持多線程、多用戶、重負載的性能要求。使用PHP+MySQL進行Web應(yīng)用系統(tǒng)開發(fā)是一種非常理想的選擇，這在當前各大網(wǎng)站服務(wù)商是常見的基本標配。作為電子商務(wù)專業(yè)的學(xué)生，靜動態(tài)網(wǎng)頁的設(shè)計是基本技能，通過本課程的學(xué)習(xí)，能夠讓學(xué)生結(jié)合遠程服務(wù)器的實踐結(jié)合，盡快掌握網(wǎng)頁開發(fā)的基礎(chǔ)代碼，提高網(wǎng)頁設(shè)計的實戰(zhàn)能力，并能最終在服務(wù)器上開發(fā)出一個小型的PHP網(wǎng)站。第一章 HTML基礎(chǔ) 課時：5周，共12課時教學(xué)內(nèi)容第一節(jié) HTML文檔結(jié)構(gòu)與基本標記的使用 一、HTML

3、文檔結(jié)構(gòu) 認識HTML靜態(tài)網(wǎng)頁的文件名稱，HTMLHEADBODY在網(wǎng)頁中句法結(jié)構(gòu) 二、超級鏈接標記 A標記，及幾個常用屬性的使用方法，尤其是URL的幾種不同方式的使用 三、文字標記 P,BR,H等標記的使用 四、圖像標記 IMG標記的使用，其SRC屬性，支持的圖像類型，圖像文件的路徑問題的說明 五、表格標記 TABLE,CAPTION,TR,TD標記的使用，COLSPAN,ROWSPAN屬性的使用介紹 六、列表標記 UL,LI標記的使用，列表的嵌入使用制作的列表菜單 第二節(jié) CSS的使用 一、CSS介紹 介紹CSS的功能，發(fā)展，與瀏覽器的關(guān)系 二、CSS的編輯與瀏覽 了解CSS的基礎(chǔ)語法，如

4、何在Dreamweaver中創(chuàng)建和使用CSS 三、HTML中使用CSS的方法 行內(nèi)樣式，內(nèi)嵌樣式，鏈接樣式，導(dǎo)入樣式四種方法的不同操作方式，以及適合的環(huán)境條件介紹 四、CSS選擇器的介紹 類選擇器，標記選擇器，ID選擇器 五、CSS與文本屬性控制 字體，字號，字體顏色，單詞間隔，對齊方式，文本行高等文本相關(guān)屬性的使用介紹 六、CSS美化背景與邊框 背景顏色，背景圖片，邊框樣式樣式線條等屬性的使用介紹 七、CSS美化布局 寬度，高度，填充，邊界，浮動等屬性的使用介紹第三節(jié) 實例結(jié)合，用CSS進行網(wǎng)頁的美化 一、案例1，蘇大招生信息網(wǎng)頁的美化 根據(jù)素材和效果圖，逐漸將無任何修飾的網(wǎng)頁美化為指定的格

5、式 二、案例2，我愛旅游網(wǎng)的美化 根據(jù)素材和效果圖，逐漸將無任何修飾的網(wǎng)頁美化為指定的格式 三、請學(xué)生自由創(chuàng)作與美化網(wǎng)頁 思考題：1、換行標記與段落標記的區(qū)別？2、在瀏覽器中圖片無法顯示的原因？3、請圖文并茂地制作一個美妝學(xué)校網(wǎng)站的首頁第二章 JavaScript客戶端腳本語言 課時：2周，共6課時教學(xué)內(nèi)容第一節(jié) JavaScript概述 一、JavaScript的語言基礎(chǔ) 數(shù)據(jù)類型，變量常量，表達式，程序流程控制語句 二、HTML文檔對象模型 對象的概念，document,getelementbyid等的使用 第二節(jié) JavaScript的使用 一、使用JavaScript進行圖像切換的實驗

6、 編寫程序，控制4個相同尺寸的圖像在固定位置的切換實例 二、使用JavaScript進行表單的驗證驗證輸入數(shù)據(jù)的有效性，驗證單選按鈕，復(fù)選按鈕的代碼思考題：1、編寫一個網(wǎng)頁，利用JavaScript將網(wǎng)頁背景色進行紅綠藍三色的切換；2、編寫制作一個購物車網(wǎng)頁，可以輸入單價，購買數(shù)量，能自動計算出總金額。提交前能驗證購買數(shù)量不能為0。 第三章 PHP5的程序設(shè)計基礎(chǔ) 課時：2周，共6課時教學(xué)內(nèi)容第一節(jié) PHP5概述 一、PHP5的特點 二、PHP5服務(wù)器的構(gòu)建要求 第二節(jié) PHP5的語言基礎(chǔ) 一、語法結(jié)構(gòu) PHP5代碼與網(wǎng)頁的相互嵌入實例 二、PHP數(shù)據(jù)類型，常量與變量數(shù)值型，字符串，布爾型的使

7、用 三、PHP的運算符和表達式字符串運算，邏輯運算 四、PHP輸出語句Echo，print 五、PHP流程控制語句IF和SWITCH分支結(jié)構(gòu)語句,WHILE和FOR循環(huán)思考題：1、編寫一個網(wǎng)頁，能夠顯示九九乘法表；2、在HTML網(wǎng)頁文件中嵌入PHP程序代碼，有哪幾種方式？第四章 常用的PHP5內(nèi)部函數(shù) 課時：1周，共3課時教學(xué)內(nèi)容第一節(jié) 日期和時間函數(shù) Getdate(),date(),time()函數(shù)的功能 第二節(jié) 文件操作函數(shù) Fopen(),fclose(),feof(),fgetc(),fgets(),fputs(),fseek()等文件操作函數(shù)的使用第三節(jié) 字符串處理函數(shù) Strto

8、upper(),strtolower(),trim(),strlen(),substr()函數(shù)的功能思考題：1、用date()與getdate()函數(shù)得到的系統(tǒng)日期方法有什么不同；2、制作一個網(wǎng)頁，利用date函數(shù)顯示當前的日期。 第五章 PHP+MySQL數(shù)據(jù)庫基礎(chǔ) 課時：3周，共9課時教學(xué)內(nèi)容第一節(jié) 在SAE上啟動MySQL SAE是新浪云服務(wù)器，支持PHP5+MySQL，請學(xué)生申請一個應(yīng)用程序，開通共享型數(shù)據(jù)庫 第二節(jié) 數(shù)據(jù)庫的創(chuàng)建和刪除 創(chuàng)建一個學(xué)生個人信息的庫表，包括學(xué)號、姓名、性別、出生日期、專業(yè)、聯(lián)系電話等第三節(jié) 表的操作 一、插入記錄 INSERT INTO VALUES語句的

9、使用舉例 二、刪除記錄 DELETE FROM語句的使用舉例 三、更新記錄 UPDATE SET語句的使用舉例 四、查詢數(shù)據(jù) SELECT語句的使用舉例 第四節(jié) PHP和MySQL數(shù)據(jù)庫的操作 一、相關(guān)命令與函數(shù) 連接數(shù)據(jù)庫Mysql_connect()，選擇數(shù)據(jù)庫mysql_select_db()，數(shù)據(jù)庫執(zhí)行操作mysql_query()，記錄集操作mysql_fetch_assoc()，獲取記錄內(nèi)容mysql_num_rows()，釋放結(jié)果mysql_free_result() 二、使用舉例 思考題：1、請敘述數(shù)據(jù)庫各層次的結(jié)構(gòu)是什么？2、使用MySQL和PHP建立一個簡單的用戶認證。第六

10、章 Dreamweaver+PHP開發(fā)基礎(chǔ) 課時：2周，共6課時教學(xué)內(nèi)容第一節(jié) Dreamweaver動態(tài)網(wǎng)頁制作步驟介紹 第二節(jié) 搭建PHP動態(tài)系統(tǒng)平臺 系統(tǒng)結(jié)構(gòu)設(shè)計，創(chuàng)建用戶數(shù)據(jù)庫，定義phpweb站點，設(shè)置數(shù)據(jù)庫連接第三節(jié) 檢查數(shù)據(jù)庫記錄 一、創(chuàng)建記錄集 利用Dreamweaver創(chuàng)建記錄集操作舉例 二、顯示記錄功能 利用Dreamweaver顯示記錄操作舉例 三、重復(fù)區(qū)域功能 利用Dreamweaver創(chuàng)建重復(fù)記錄操作舉例 四、記錄集分頁功能 利用Dreamweaver創(chuàng)建分頁顯示記錄操作舉例 五、顯示記錄計數(shù)功能 利用Dreamweaver顯示記錄計數(shù)的操作舉例 六、顯示區(qū)域功能 利

11、用Dreamweaver創(chuàng)建顯示區(qū)域的操作舉例 七、顯示詳細信息 利用Dreamweaver創(chuàng)建顯示詳細信息的操作舉例 第四節(jié) 編輯記錄功能 一、新增記錄功能 利用Dreamweaver實現(xiàn)新增記錄集操作舉例 二、更新記錄功能 利用Dreamweaver實現(xiàn)更新記錄集操作舉例 三、刪除記錄功能 利用Dreamweaver實現(xiàn)刪除記錄集操作舉例 第七章 案例舉例：新聞發(fā)布系統(tǒng)開發(fā) 課時：2周，共6課時教學(xué)內(nèi)容第一節(jié) 系統(tǒng)的整體設(shè)計規(guī)劃 一、頁面設(shè)計規(guī)劃 系統(tǒng)功能確定，頁面與文件名，功能設(shè)計 二、頁面美工規(guī)劃 確定系統(tǒng)的色調(diào)，布局，樣式 第二節(jié) 系統(tǒng)的數(shù)據(jù)庫設(shè)計與連接 一、新聞數(shù)據(jù)庫設(shè)計規(guī)劃 新聞

12、信息數(shù)據(jù)表news，新聞分類信息數(shù)據(jù)表newstype，管理信息數(shù)據(jù)表admin 二、定義news站點 在Dreamweaver中創(chuàng)建網(wǎng)站站點，并測試服務(wù)器。 三、設(shè)置數(shù)據(jù)庫連接 在Dreamweaver中創(chuàng)建新聞發(fā)布系統(tǒng)網(wǎng)站與數(shù)據(jù)庫之間的連接，并測試。 第三節(jié) 系統(tǒng)頁面設(shè)計 一、新聞發(fā)布系統(tǒng)首頁設(shè)計 完成主頁面index.php的制作，主要有顯示最新新聞的標題、加入時間、顯示新聞分類、單擊新聞中的分類進入分類子頁面查看新聞等功能。 二、新聞分類頁面設(shè)計 完成新聞分類頁面type.php用于每個新聞分類的頁面，當訪問者單擊index.php頁面中的任何一個新聞分類標題時，就會打開相應(yīng)的新聞分類

13、頁面。 三、新聞內(nèi)容頁面設(shè)計 完成新聞內(nèi)容頁面newscontent.php的制作，用于顯示每一條新聞的詳細內(nèi)容，這個頁面設(shè)計的重點在于如何接收主頁面index.php和type.php所傳遞過來的參數(shù)，并根據(jù)這個參數(shù)顯示數(shù)據(jù)庫中相應(yīng)的數(shù)據(jù)。第四節(jié) 后臺管理頁面設(shè)計 一、管理入口頁面設(shè)計 完成admin文件夾下admin_login.php的制作，該頁面必須受到權(quán)限管理，可以利用登錄賬號與密碼是否為有效用戶來實現(xiàn)權(quán)限的設(shè)置管理。 二、管理主頁面設(shè)計 完成admin文件夾下admin.php的制作，后臺管理主頁面是管理員在登錄頁面驗證成功后所登錄的頁面，這個頁面可以實現(xiàn)新增、修改或刪除新聞內(nèi)容和

14、新聞分類的內(nèi)容，使網(wǎng)站能隨時保持最新、最實時的信息。 三、新聞內(nèi)容頁面設(shè)計 完成admin文件夾下的新聞內(nèi)容頁面newscontent.php的制作，用于顯示每一條新聞的詳細內(nèi)容，這個頁面設(shè)計的重點在于如何接收主頁面index.php和type.php所傳遞過來的參數(shù)，并根據(jù)這個參數(shù)顯示數(shù)據(jù)庫中相應(yīng)的數(shù)據(jù)。 四、新增新聞頁面設(shè)計 完成admin文件夾下的新增新聞頁面news_add.php的制作，主要實現(xiàn)插入新聞的功能。 五、修改新聞頁面設(shè)計 完成admin文件夾下的修改新聞頁面news_upd.php的制作，主要功能是將數(shù)據(jù)表中的數(shù)據(jù)送到頁面的表單中進行修改，修改數(shù)據(jù)后再將數(shù)據(jù)更新到數(shù)據(jù)表中。 六、刪除新聞頁面設(shè)計 完成admin文件夾下的刪除新聞頁面news_del.php的制作，主要功能是將表單中的數(shù)據(jù)從站點數(shù)據(jù)表中刪除。 七、修改新聞分類頁面設(shè)計 完成admin文件夾下的修改新聞分類頁面type_upd.php的制作，主要功能是將數(shù)據(jù)表中的數(shù)據(jù)送到頁面的表單中進行修改，修改數(shù)據(jù)后再將數(shù)據(jù)更新到數(shù)據(jù)表中。 八、刪除新聞分類頁面設(shè)計 完成a