實(shí)驗(yàn)指導(dǎo)書電子商務(wù)應(yīng)用開發(fā)技術(shù)

PAGEPAGE77《— 電子商務(wù)應(yīng)用開發(fā)技術(shù)—》實(shí)驗(yàn)指導(dǎo)書尹雋編寫適用專業(yè)：電子商務(wù)信息管理與信息系統(tǒng) 江蘇科技大學(xué)經(jīng)濟(jì)管理學(xué)院2012年08月前言《電子商務(wù)應(yīng)用開發(fā)技術(shù)》課程主要從構(gòu)建一個(gè)功能比較齊全的電子商務(wù)系統(tǒng)的角度出發(fā)，首先講授電子商務(wù)系統(tǒng)的基本架構(gòu)；然后從電子商務(wù)系統(tǒng)三層體系結(jié)構(gòu)分別講述：電子商務(wù)系統(tǒng)表達(dá)層：網(wǎng)站的基本實(shí)現(xiàn)技術(shù)的原理特征以及具體實(shí)現(xiàn)技術(shù)和方法；電子商務(wù)系統(tǒng)邏輯層——包括電子商務(wù)系統(tǒng)的分析、設(shè)計(jì)與集成過程，以及具體的邏輯層實(shí)現(xiàn)技術(shù)；電子商務(wù)數(shù)據(jù)層——電子商務(wù)時(shí)代數(shù)據(jù)管理需求與技術(shù)特征，數(shù)據(jù)模型的概念與發(fā)展，數(shù)據(jù)庫管理系統(tǒng)的功能、運(yùn)行機(jī)理、發(fā)展動(dòng)態(tài)，不同體系結(jié)構(gòu)下數(shù)據(jù)訪問接口技術(shù)的特征等；最后綜合電子商務(wù)三層體系結(jié)構(gòu)，以介紹完整的電子商務(wù)解決方案及相關(guān)的技術(shù)動(dòng)態(tài)的形式進(jìn)行總結(jié)。通過學(xué)習(xí)學(xué)生能對電子商務(wù)系統(tǒng)及其包含的技術(shù)有充分深入的理解，并通過對電子商務(wù)表達(dá)層、邏輯層、數(shù)據(jù)層三層體系結(jié)構(gòu)分步驟的技術(shù)理解，掌握系統(tǒng)從規(guī)劃、設(shè)計(jì)到實(shí)現(xiàn)的全過程，在此過程中逐漸具備各層次技術(shù)的實(shí)踐操作能力，并通過實(shí)驗(yàn)鞏固對技術(shù)的掌握；最終通過電子商務(wù)解決方案的形式對電子商務(wù)系統(tǒng)及其技術(shù)進(jìn)行綜合理解。作為技術(shù)先導(dǎo)課本課程需要起到承上啟下的作用，因此本指導(dǎo)書將從基本應(yīng)用入手，從分析、解決應(yīng)用問題的目的出發(fā)，在問題求解過程中反映出應(yīng)用技術(shù)的理論基礎(chǔ)和發(fā)展演變規(guī)律，希望通過課程的學(xué)習(xí)以及實(shí)際操作，激發(fā)同學(xué)們學(xué)習(xí)技術(shù)的熱情，從而進(jìn)一步引導(dǎo)學(xué)生以后對電子商務(wù)系統(tǒng)各層次技術(shù)的進(jìn)行深入學(xué)習(xí)和探索。一、實(shí)驗(yàn)開設(shè)目標(biāo)、總體內(nèi)容為了使學(xué)生更好地理解和深刻地把握這些知識，并在此基礎(chǔ)上，訓(xùn)練和培養(yǎng)學(xué)生對電子商務(wù)表達(dá)層技術(shù)（包括靜態(tài)與客戶端動(dòng)態(tài)網(wǎng)頁技術(shù)）、邏輯層技術(shù)（包括一種服務(wù)端動(dòng)態(tài)網(wǎng)頁技術(shù)，包括對應(yīng)的網(wǎng)絡(luò)編程語言）、數(shù)據(jù)層技術(shù)（一種數(shù)據(jù)庫管理系統(tǒng)數(shù)據(jù)庫設(shè)計(jì)、開發(fā)相關(guān)技能）的理解和掌握，并針對這些技能的要求設(shè)置了包括電子商務(wù)系統(tǒng)體驗(yàn)、個(gè)人網(wǎng)頁規(guī)劃和設(shè)計(jì)等八個(gè)實(shí)驗(yàn)項(xiàng)目，其中個(gè)人主頁全面開發(fā)并上傳、電子商務(wù)系統(tǒng)規(guī)劃報(bào)告、根據(jù)系統(tǒng)規(guī)劃方案實(shí)現(xiàn)電子商務(wù)系統(tǒng)三個(gè)實(shí)驗(yàn)為綜合性、設(shè)計(jì)性實(shí)驗(yàn)。二、各項(xiàng)實(shí)驗(yàn)主要了解、掌握的具體知識，訓(xùn)練及培養(yǎng)的技能實(shí)驗(yàn)一要求在理解第一章電子商務(wù)總體體系結(jié)構(gòu)，電子商務(wù)系統(tǒng)模式、特點(diǎn)，通過對成功電子商務(wù)系統(tǒng)的體驗(yàn)實(shí)驗(yàn)進(jìn)一步理解與傳統(tǒng)管理信息系統(tǒng)的區(qū)別，初步建立對電子商務(wù)系統(tǒng)環(huán)境的感性認(rèn)識。實(shí)驗(yàn)二、三、四是通過實(shí)驗(yàn)，對第二章電子商務(wù)表達(dá)層技術(shù)，包括網(wǎng)頁規(guī)劃設(shè)計(jì)、靜態(tài)網(wǎng)頁著作以及客戶端動(dòng)態(tài)網(wǎng)頁技術(shù)實(shí)現(xiàn)逐步的深入理解掌握。實(shí)驗(yàn)五、六是在熟悉第三章電子商務(wù)邏輯層內(nèi)容的基礎(chǔ)上，掌握建立一個(gè)大型電子商務(wù)系統(tǒng)設(shè)計(jì)及實(shí)現(xiàn)的核心技術(shù)，能通過一種網(wǎng)絡(luò)編程語言實(shí)現(xiàn)系統(tǒng)的核心邏輯。實(shí)驗(yàn)七是在理解電子商務(wù)系統(tǒng)分析設(shè)計(jì)過程以及第三章數(shù)據(jù)層的基礎(chǔ)上，規(guī)劃設(shè)計(jì)目標(biāo)電子商務(wù)系統(tǒng)，包括分析、設(shè)計(jì)和集成過程以及目標(biāo)系統(tǒng)的數(shù)據(jù)庫架構(gòu)，前者需要根據(jù)軟件工程思想以及電子商務(wù)的特點(diǎn)進(jìn)行系統(tǒng)規(guī)劃、分析，后者需要結(jié)合《數(shù)據(jù)庫原理與應(yīng)用》課程中對數(shù)據(jù)庫范式的知識以及電子商務(wù)系統(tǒng)數(shù)據(jù)庫的特點(diǎn)進(jìn)行設(shè)計(jì)。實(shí)驗(yàn)八是在實(shí)驗(yàn)七電子商務(wù)系統(tǒng)規(guī)劃方案的指導(dǎo)下，結(jié)合實(shí)驗(yàn)七電子商務(wù)系統(tǒng)數(shù)據(jù)架構(gòu)設(shè)計(jì)，采用一種網(wǎng)絡(luò)編程語言進(jìn)行電子商務(wù)系統(tǒng)的開發(fā)實(shí)現(xiàn)，需要實(shí)現(xiàn)其核心部分。三、本指導(dǎo)書的特點(diǎn)電子商務(wù)應(yīng)用開發(fā)技術(shù)實(shí)驗(yàn)是該課程重要的實(shí)踐性環(huán)節(jié)，是教學(xué)過程中必不可少的重要內(nèi)容，通過對電子商務(wù)系統(tǒng)案例分析、技術(shù)體驗(yàn)，使學(xué)生逐步加深理解、驗(yàn)證和鞏固課堂教學(xué)內(nèi)容；增強(qiáng)對電子商務(wù)系統(tǒng)的感性認(rèn)識；掌握電子商務(wù)系統(tǒng)分析、設(shè)計(jì)、實(shí)施的基本方法；培養(yǎng)學(xué)生理論與實(shí)踐相結(jié)合的能力。本指導(dǎo)書基于電子商務(wù)系統(tǒng)完整的知識體系基礎(chǔ)上構(gòu)建完成，因此對技術(shù)的實(shí)驗(yàn)設(shè)置具備較強(qiáng)的連貫性。實(shí)驗(yàn)的完成需要緊密結(jié)合課程知識，并結(jié)合之前實(shí)驗(yàn)所掌握的技能。由于實(shí)驗(yàn)先后銜接的比較緊密，學(xué)生認(rèn)真做好每個(gè)實(shí)驗(yàn)的同時(shí)，教師應(yīng)隨時(shí)與學(xué)生交流，掌握學(xué)生對實(shí)驗(yàn)的掌握程度并進(jìn)行針對性講解分析。四、對不同專業(yè)選修情況說明由于信息管理與信息系統(tǒng)專業(yè)不設(shè)置課程設(shè)計(jì)，實(shí)驗(yàn)八需要適當(dāng)提高要求并加2個(gè)課時(shí)的實(shí)驗(yàn)，要求能完成電子商務(wù)系統(tǒng)的核心部分功能；對設(shè)置課程設(shè)計(jì)的專業(yè)，要求學(xué)生在課程設(shè)計(jì)中完整完成這個(gè)電子商務(wù)系統(tǒng)，并以此為起點(diǎn)，最后一次的實(shí)驗(yàn)要求適當(dāng)降低，。五、實(shí)驗(yàn)設(shè)備配置每人配置1臺電腦，可訪問Internet網(wǎng)。六、考核與報(bào)告1、每次實(shí)驗(yàn)后，學(xué)生將實(shí)驗(yàn)結(jié)果等內(nèi)容寫出實(shí)驗(yàn)報(bào)告（例如系統(tǒng)可行性分析報(bào)告、系統(tǒng)分析報(bào)告，系統(tǒng)設(shè)計(jì)說明書、系統(tǒng)程序等），符合實(shí)驗(yàn)教學(xué)的要求，并得到指導(dǎo)教師的認(rèn)可。2、指導(dǎo)教師對每份實(shí)驗(yàn)報(bào)告進(jìn)行審閱、評分。3、該實(shí)驗(yàn)程依附于理論課，實(shí)驗(yàn)課的成績記入課程平時(shí)成績，占平時(shí)成績的80%（平時(shí)成績占總成績的30%）。七、注意事項(xiàng)1、上機(jī)課時(shí)要求必須帶本次實(shí)驗(yàn)課的指導(dǎo)書以及相關(guān)的教材資料；2、實(shí)驗(yàn)指導(dǎo)書每人一份，注意保管；3、實(shí)驗(yàn)指導(dǎo)書僅作為上機(jī)時(shí)候的步驟提要，不能作為唯一的依據(jù)，以教材和課堂講授為準(zhǔn)。

目錄TOC\o"1-1"\h\z\u實(shí)驗(yàn)一：電子商務(wù)系統(tǒng)案例分析 5實(shí)驗(yàn)二：個(gè)人網(wǎng)站的規(guī)劃與設(shè)計(jì) 9實(shí)驗(yàn)三：運(yùn)用網(wǎng)頁制作工具開發(fā)個(gè)人網(wǎng)站首頁同時(shí)掌握HTML語言 14實(shí)驗(yàn)四：個(gè)人網(wǎng)站全面開發(fā)并上傳 32實(shí)驗(yàn)五：ASP技術(shù)實(shí)現(xiàn)基本循環(huán) 51實(shí)驗(yàn)六：服務(wù)端動(dòng)態(tài)技術(shù)實(shí)現(xiàn)用戶登錄驗(yàn)證（數(shù)據(jù)庫驗(yàn)證） 59實(shí)驗(yàn)七：電子商務(wù)系統(tǒng)規(guī)劃設(shè)計(jì)報(bào)告 70實(shí)驗(yàn)八：根據(jù)系統(tǒng)規(guī)劃方案實(shí)現(xiàn)電子商務(wù)系統(tǒng) 81附件：學(xué)生實(shí)驗(yàn)報(bào)告基本內(nèi)容要求 85

實(shí)驗(yàn)一：電子商務(wù)系統(tǒng)案例分析實(shí)驗(yàn)學(xué)時(shí)：2實(shí)驗(yàn)類型：（驗(yàn)證）實(shí)驗(yàn)要求：（必修）一、實(shí)驗(yàn)?zāi)康慕Y(jié)合第一章的內(nèi)容在掌握電子商務(wù)、電子商務(wù)系統(tǒng)相關(guān)內(nèi)涵的基礎(chǔ)上，能進(jìn)一步理解電子商務(wù)與傳統(tǒng)商務(wù)的區(qū)別、電子商務(wù)系統(tǒng)與傳統(tǒng)信息系統(tǒng)的區(qū)別，并能電子商務(wù)系統(tǒng)框架結(jié)構(gòu)與體系結(jié)構(gòu)，從而為其后進(jìn)行電子商務(wù)系統(tǒng)表達(dá)層、邏輯層和數(shù)據(jù)層的理解和技術(shù)學(xué)習(xí)奠定堅(jiān)實(shí)基礎(chǔ)。二、實(shí)驗(yàn)內(nèi)容和步驟選擇一個(gè)電子商務(wù)系統(tǒng)（或者團(tuán)購、返利以及推薦等），學(xué)生應(yīng)能正確判斷其所采取的電子商務(wù)模式，并進(jìn)行相應(yīng)分析。主要比較模式、技術(shù)、管理、服務(wù)幾個(gè)方面，對于比較新的模式，例如團(tuán)購、返利和推薦可以采用對比的方式，對比配送、支付、售后、特色等等，其中團(tuán)購是2010年引入，有一種叫做O2O，線上購線下消費(fèi)。1、選擇一個(gè)成功的電子商務(wù)系統(tǒng)，進(jìn)入該系統(tǒng)；2、瀏覽系統(tǒng)整體，并確定其電子商務(wù)模式（B2C、B2B、C2C、G2B、B2C）；3、注冊其會員，并模擬角色實(shí)現(xiàn)完整的商務(wù)過程（包括評價(jià)），分別截屏并對應(yīng)說明過程（可忽略實(shí)際支付環(huán)節(jié)），并考察其物流配送過程。1）寫出該系統(tǒng)的基本功能2）寫出與傳統(tǒng)購物過程的比較與分析。3）為了贏得潛在客戶，該網(wǎng)站做了哪些努力？4）該網(wǎng)站采取了哪些相應(yīng)的營銷策略（產(chǎn)品策略、價(jià)格策略、銷售渠道策略、促銷策略等），分別是如何做的，效果如何？說出你的建議。5）總結(jié)該電子商務(wù)系統(tǒng)的優(yōu)點(diǎn)，缺點(diǎn)（待改進(jìn)的地方）；4、闡述電子商務(wù)系統(tǒng)網(wǎng)站和其他各類網(wǎng)站的區(qū)別。三、實(shí)驗(yàn)原理、方法和手段1、實(shí)驗(yàn)原理1）電子商務(wù)必須以商務(wù)為本：講求效益、追求利潤是電子商務(wù)的第一要旨；企業(yè)是電子商務(wù)的主角，企業(yè)是推動(dòng)電子商務(wù)發(fā)展的重要?jiǎng)恿?；設(shè)計(jì)和建設(shè)電子商務(wù)時(shí)，要從商務(wù)需求出發(fā)，要根據(jù)商務(wù)需求和商務(wù)目標(biāo)確定所選用的技術(shù)，而不是從技術(shù)或模式出發(fā)；2）傳統(tǒng)商務(wù)與電子商務(wù)的區(qū)別：傳統(tǒng)商務(wù)與電子商務(wù)最核心的區(qū)別，就是商務(wù)對象的變化。電子商務(wù)首先要將實(shí)實(shí)在在的商品虛擬化，形成信息化（數(shù)字化、多媒體化）的虛擬商品，進(jìn)而對虛擬商品進(jìn)行整理、儲存和傳輸；3）電子商務(wù)與電子商務(wù)系統(tǒng)：電子商務(wù)與電子商務(wù)系統(tǒng)最核心的區(qū)分在于目標(biāo)不同，電子商務(wù)的目標(biāo)是完成商務(wù)，而電子商務(wù)系統(tǒng)的目標(biāo)是提供商務(wù)活動(dòng)所需要的信息溝通與交流的環(huán)境以及相關(guān)的信息流程，要實(shí)現(xiàn)電子商務(wù)，必須首先建立電子商務(wù)系統(tǒng)；4）電子商務(wù)系統(tǒng)與傳統(tǒng)信息系統(tǒng)的區(qū)別與聯(lián)系；5）電子商務(wù)大系統(tǒng)的核心意義，需要采用系統(tǒng)工程的思路去建設(shè)；6）電子商務(wù)各類應(yīng)用對技術(shù)的挑戰(zhàn)：消費(fèi)主體、企業(yè)主體以及政府主體電子商務(wù)應(yīng)用對技術(shù)提出了不同層次的挑戰(zhàn)，根據(jù)所分析的電子商務(wù)系統(tǒng)站在其中一個(gè)角度去理解與體會；7）電子商務(wù)系統(tǒng)的體系結(jié)構(gòu)：商務(wù)表達(dá)層、商務(wù)邏輯層、數(shù)據(jù)層。2、實(shí)驗(yàn)方法與手段選擇具有代表性的電子商務(wù)系統(tǒng)，認(rèn)真使用該系統(tǒng)，并模擬其中的角色實(shí)現(xiàn)部分或者全部的商務(wù)過程，從中體會其商務(wù)過程以及技術(shù)體系架構(gòu)，并按照實(shí)驗(yàn)內(nèi)容與實(shí)驗(yàn)步驟的要求進(jìn)行分析。四、實(shí)驗(yàn)組織運(yùn)行要求先由教師集中授課，講解如何進(jìn)行實(shí)驗(yàn)，然后是學(xué)生自主訓(xùn)練。五、實(shí)驗(yàn)條件1、每個(gè)學(xué)生一臺電腦、要求能通過互聯(lián)網(wǎng)訪問電子商務(wù)系統(tǒng)；2、實(shí)驗(yàn)環(huán)境：Windows98/2000/XP系統(tǒng)且瀏覽器為IE。六、思考題1、搜集電子商務(wù)發(fā)展的數(shù)據(jù)和趨勢，寫出自己的體會分析。2、從消費(fèi)者消費(fèi)應(yīng)用、消費(fèi)者休閑娛樂、消費(fèi)者金融服務(wù)、消費(fèi)者教育培訓(xùn)、企業(yè)、政府等多角色多覺得說說其對電子商務(wù)的技術(shù)要求。（例如消費(fèi)者休閑娛樂希望的有聯(lián)機(jī)游戲、自選電視等等）。3、談?wù)勛约簩Α半娮由虅?wù)應(yīng)以商務(wù)為本，電子商務(wù)是一個(gè)大系統(tǒng)”的核心含義。4、通過學(xué)習(xí)對電子商務(wù)的理解、對電子商務(wù)系統(tǒng)的理解與之前自己的理解有何不同。5、B2B2、團(tuán)購、返利以及推薦模式，選擇其中一個(gè)分析其盈利模式。八、實(shí)驗(yàn)要求1、實(shí)驗(yàn)預(yù)習(xí)在實(shí)驗(yàn)前需要對第一章內(nèi)容進(jìn)行深入的理解，特別對電子商務(wù)、電子商務(wù)系統(tǒng)、電子商務(wù)系統(tǒng)的體系結(jié)構(gòu)等理論深入理解。2、實(shí)驗(yàn)記錄無3、實(shí)驗(yàn)報(bào)告1）填寫課程名稱，實(shí)驗(yàn)日期。2）填寫學(xué)生所在的班級、學(xué)號、姓名3）實(shí)驗(yàn)報(bào)告部分為主體部分，根據(jù)實(shí)驗(yàn)內(nèi)容、實(shí)驗(yàn)步驟的要求編寫電子商務(wù)系統(tǒng)案例分析報(bào)告，要求能夠提出自己的看法。4）成績一欄和最后的指導(dǎo)教師評語為教師填寫。九、其它說明必要時(shí)對上述相關(guān)內(nèi)容進(jìn)行補(bǔ)充，或告知學(xué)生實(shí)驗(yàn)室管理的相關(guān)規(guī)定及安全事項(xiàng)等內(nèi)容。

實(shí)驗(yàn)二：個(gè)人網(wǎng)站的規(guī)劃與設(shè)計(jì)實(shí)驗(yàn)學(xué)時(shí)：2實(shí)驗(yàn)類型：（驗(yàn)證） 實(shí)驗(yàn)要求：（必修）一、實(shí)驗(yàn)?zāi)康慕Y(jié)合第二章電子商務(wù)表達(dá)層的內(nèi)容，而網(wǎng)站作為電子商務(wù)最主要的表達(dá)平臺，要求在掌握其制作技術(shù)之前能夠進(jìn)行網(wǎng)站的規(guī)劃與設(shè)計(jì)，應(yīng)首先明確網(wǎng)站的性質(zhì)、目的、針對不同的類型進(jìn)行創(chuàng)意。首先確定最終用戶是關(guān)鍵的一步，不同的用戶有不同的設(shè)計(jì)要求，從規(guī)劃、界面設(shè)計(jì)一致到顏色和文件格式的選擇；另一個(gè)核心是站點(diǎn)內(nèi)容的組織、頁面/超鏈接、導(dǎo)航設(shè)計(jì)、站點(diǎn)風(fēng)格等關(guān)鍵問題等進(jìn)行有效決策。而作為站點(diǎn)設(shè)計(jì)人員不僅需要對技術(shù)進(jìn)行了解，而且對藝術(shù)、形象設(shè)計(jì)、客戶心理等需要有充分的理解，所以某些時(shí)候?qū)⒄军c(diǎn)的結(jié)構(gòu)設(shè)計(jì)人員稱為站點(diǎn)設(shè)計(jì)師或者信息構(gòu)建師，由此規(guī)劃的作用可想而知。通過對內(nèi)容詳實(shí)的規(guī)劃與設(shè)計(jì)，為電子商務(wù)表達(dá)層的具體制作打下堅(jiān)實(shí)的基礎(chǔ)。二、實(shí)驗(yàn)內(nèi)容個(gè)人網(wǎng)站的總體規(guī)劃設(shè)計(jì)，主要包括1、個(gè)人網(wǎng)站的主題和名稱；2、網(wǎng)站的CI形象；3、根據(jù)主題確定網(wǎng)站欄目；4、確定網(wǎng)站的目錄結(jié)構(gòu)與鏈接結(jié)構(gòu)；5、確定網(wǎng)站的整體風(fēng)格與創(chuàng)意設(shè)計(jì)；6、首頁的具體設(shè)計(jì)；7、各頁面版面布局；8、網(wǎng)站的色彩搭配設(shè)計(jì)。三、實(shí)驗(yàn)原理、方法和手段1、實(shí)驗(yàn)原理1）網(wǎng)站的主題與名稱①主題要小而精定位要小，內(nèi)容要精；②題材最好是自己擅長或者喜愛的內(nèi)容；③題材不要太濫或者目標(biāo)太高；④網(wǎng)站名稱要正氣、要易記、要有特色。2）網(wǎng)站的CI形象①設(shè)計(jì)網(wǎng)站的標(biāo)志（Logo）；②設(shè)計(jì)網(wǎng)站的標(biāo)準(zhǔn)色彩；③設(shè)計(jì)網(wǎng)站的標(biāo)準(zhǔn)字體；④設(shè)計(jì)網(wǎng)站的宣傳標(biāo)語。3）根據(jù)主題確認(rèn)網(wǎng)站的欄目①盡可能將網(wǎng)站最有價(jià)值的內(nèi)容列在欄目上；②盡可能方便訪問者的瀏覽和查詢；③盡可能刪除與主題無關(guān)的欄目。4）確定網(wǎng)站的目錄結(jié)構(gòu)與鏈接結(jié)構(gòu)不要將所有文件都存放在根目錄下；按欄目內(nèi)容建立子目錄；不要使用過長的目錄名；盡量使用意義明確的目錄名，盡量做到“見名知意”；目錄的層次不要太多，建議不要超過3層。5）確定網(wǎng)站的整體風(fēng)格與創(chuàng)意設(shè)計(jì)其形式法則主要包括：視覺流程；點(diǎn)、線、面；形狀間的組合和構(gòu)成關(guān)系；形狀與空間關(guān)系；構(gòu)架與空間；節(jié)奏與韻律；對比、調(diào)和與統(tǒng)一；裝飾與趣味。6）網(wǎng)站首頁設(shè)計(jì)確定首頁的功能模塊、設(shè)計(jì)首頁的版面、處理技術(shù)上的細(xì)節(jié)。7）確定網(wǎng)頁版面布局8）網(wǎng)站的色彩搭配主要內(nèi)容文字用非彩色（黑色），邊框、背景、圖片用彩色，這樣頁面整體不單調(diào)，看主要內(nèi)容也不會眼花。9）其他建議網(wǎng)頁的創(chuàng)意設(shè)計(jì)包括文字排列方向、字群聚散組合，字體大小風(fēng)格的選擇，圖片的分布及色彩與空白的經(jīng)營，不僅追求網(wǎng)頁形式的變化，更重視各視覺元素的不同形式和構(gòu)成能給人在感情上造成不同的心理感受，并體現(xiàn)不同的主題。①內(nèi)容與形式表現(xiàn)必須統(tǒng)一和有序，形式表現(xiàn)必須服從內(nèi)容要求，在造型上各構(gòu)成要素規(guī)格化的設(shè)計(jì)樣式要統(tǒng)一；②必須考慮網(wǎng)頁上各構(gòu)成要素之間的視覺流程，能自然而有序地達(dá)到信息訴求重點(diǎn)的位置，突出主題；③由于大多數(shù)媒體是適用于縱向的，而屏幕是適用于橫向的；屏幕是由后向前發(fā)光，改變了顏色的對比屬性；④必須考慮超鏈接的非線形特點(diǎn)，使用戶可以自主地訪問網(wǎng)站，讓他們知道在哪里，可以到哪個(gè)地方去，所以方便清晰的導(dǎo)航以及適當(dāng)?shù)姆祷匕粹o設(shè)計(jì)非常重要；⑤突出主題要素；⑥注意網(wǎng)頁設(shè)計(jì)中的空白處理；⑦在視覺上著力強(qiáng)調(diào)網(wǎng)頁的訴求重點(diǎn)。2、方法和手段根據(jù)自己選定的個(gè)人網(wǎng)站的主題，進(jìn)行一系列的網(wǎng)站規(guī)劃與設(shè)計(jì)，目的是在規(guī)劃設(shè)計(jì)的基礎(chǔ)上，利用一定的素材，采用即將學(xué)習(xí)到的網(wǎng)頁開發(fā)相關(guān)技術(shù)實(shí)現(xiàn)規(guī)劃設(shè)計(jì)的內(nèi)容。四、實(shí)驗(yàn)組織運(yùn)行要求先由教師集中授課，講解如何進(jìn)行實(shí)驗(yàn)，然后是學(xué)生自主訓(xùn)練。五、實(shí)驗(yàn)條件1、每個(gè)學(xué)生一臺電腦、要求能通過互聯(lián)網(wǎng)訪問電子商務(wù)系統(tǒng)；2、實(shí)驗(yàn)環(huán)境：Windows98/2000/XP系統(tǒng)且瀏覽器為IE。六、實(shí)驗(yàn)步驟1、確定個(gè)人網(wǎng)站的主題和名稱；2、設(shè)計(jì)網(wǎng)站的CI形象，包括其Logo、色彩、字體等；3、根據(jù)主題確定網(wǎng)站的欄目；4、確定網(wǎng)站的鏈接結(jié)構(gòu)與目錄結(jié)構(gòu)；5、確定網(wǎng)站的整體風(fēng)格與創(chuàng)意設(shè)計(jì)；6、網(wǎng)站首頁設(shè)計(jì)，并適當(dāng)收集首頁所需要的素材；7、確定網(wǎng)頁版面布局；8、確定網(wǎng)站的色彩搭配；9、根據(jù)網(wǎng)站規(guī)劃設(shè)計(jì)的主體以及欄目適當(dāng)收集素材。七、思考題1、網(wǎng)站規(guī)劃設(shè)計(jì)的必要性。2、網(wǎng)站規(guī)劃設(shè)計(jì)時(shí)的心得體會，在指導(dǎo)教師所列舉的實(shí)際網(wǎng)站中挑選其中2-3個(gè)分析其整體風(fēng)格、創(chuàng)意、版面布局、色彩搭配以及首頁的設(shè)計(jì)，并提出自己的看法。八、實(shí)驗(yàn)要求1、實(shí)驗(yàn)預(yù)習(xí)1）在實(shí)驗(yàn)前需要對電子商務(wù)表達(dá)層——網(wǎng)站有一個(gè)初步的理解，包括其概念以及基本元素，包含的基本技術(shù)等，在此基礎(chǔ)上進(jìn)行具體的規(guī)劃設(shè)計(jì)；2）預(yù)習(xí)網(wǎng)站規(guī)劃設(shè)計(jì)需要針對網(wǎng)站的哪些方面進(jìn)行，參見“實(shí)驗(yàn)內(nèi)容”。2、實(shí)驗(yàn)記錄無3、實(shí)驗(yàn)報(bào)告1）填寫課程名稱，實(shí)驗(yàn)日期。2）填寫學(xué)生所在的班級、學(xué)號、姓名3）實(shí)驗(yàn)報(bào)告部分為主體部分，根據(jù)實(shí)驗(yàn)內(nèi)容、實(shí)驗(yàn)步驟的要求編寫個(gè)人網(wǎng)站的總體規(guī)劃設(shè)計(jì)，要求個(gè)性鮮明，內(nèi)容豐富，創(chuàng)意獨(dú)特。4）成績一欄和最后的指導(dǎo)教師評語為教師填寫。九、其它說明必要時(shí)對上述相關(guān)內(nèi)容進(jìn)行補(bǔ)充，或告知學(xué)生實(shí)驗(yàn)室管理的相關(guān)規(guī)定及安全事項(xiàng)等內(nèi)容。

實(shí)驗(yàn)三：運(yùn)用網(wǎng)頁制作工具開發(fā)個(gè)人網(wǎng)站首頁同時(shí)掌握HTML語言實(shí)驗(yàn)學(xué)時(shí)：4實(shí)驗(yàn)類型：（驗(yàn)證）實(shí)驗(yàn)要求：（必修）一、實(shí)驗(yàn)?zāi)康慕Y(jié)合第二章電子商務(wù)表達(dá)層中關(guān)于靜態(tài)網(wǎng)頁開發(fā)技術(shù)，能按照實(shí)驗(yàn)二中規(guī)劃的內(nèi)容，使用網(wǎng)頁制作工具進(jìn)行個(gè)人網(wǎng)站——首頁的開發(fā)，與此同時(shí)，能掌握HTML標(biāo)記的使用，為網(wǎng)絡(luò)編程語言的運(yùn)用奠定基礎(chǔ)。二、實(shí)驗(yàn)內(nèi)容1、根據(jù)個(gè)人網(wǎng)站的規(guī)劃設(shè)計(jì)的內(nèi)容（其中包括整個(gè)網(wǎng)站以及首頁的規(guī)劃），進(jìn)行網(wǎng)站首頁的開發(fā)，要求整體符合規(guī)劃。1）利用網(wǎng)頁編輯工具首先設(shè)置網(wǎng)頁標(biāo)題；2）然后進(jìn)行整體布局，可利用框架、層或者表格對象進(jìn)行；3）在此基礎(chǔ)上在首頁中放置網(wǎng)站的欄目，以圖像或者文字的形式均可，并進(jìn)行適當(dāng)?shù)男揎棧?）補(bǔ)充網(wǎng)頁具體內(nèi)容元素，主要包括圖像、文字等，并適當(dāng)修飾；5）最后考慮采用Marquee、Javascript效果或者Flash動(dòng)態(tài)等元素充實(shí)美化頁面（Javascript技術(shù)將在實(shí)驗(yàn)四具體講解），可適當(dāng)考慮增加背景音樂等元素。2、在進(jìn)行首頁開發(fā)的同時(shí)，能掌握HTML標(biāo)記的運(yùn)用1）網(wǎng)頁基本元素<Html>表示Html網(wǎng)頁開始與結(jié)束；<Head>表示網(wǎng)頁頭開始與結(jié)束；<Body>表示網(wǎng)頁主體內(nèi)容的開始與結(jié)束?！纠浚阂粋€(gè)基本的空白網(wǎng)頁HTML代碼為<Html><Head></Head><Body></Body></Html>2）網(wǎng)頁標(biāo)題（Title）【例】：<Html><Title>我的網(wǎng)頁</Title>Thisismyfirsthtmlfile.</Html>3）網(wǎng)頁的背影和文本顏色窗口背景可以用下列方法指定<Bodybackground="image-url"><Bodybgcolor=#text=#link=#alink=#vlink=#>前者指定填充背景的圖像，如果圖像小于窗口的大小，則把背景圖像重復(fù)，直到填滿窗口區(qū)域。后者指定的是16進(jìn)制的紅、綠、藍(lán)分量。屬性：bgcolor背景顏色text文本顏色Link鏈接指針顏色alinik活動(dòng)的鏈接指針顏色vlinik已訪問過的鏈接指針顏色【例】：<Bodybgcolor=“FF00000”注意，此時(shí)網(wǎng)頁主體元素必須寫完整，即用<Body>結(jié)束4）文字（修飾）①字體大小Html有七種字號，1號最小，7號最大。缺省字號為3，可以用<basefontsize=字號>設(shè)置缺省字號。設(shè)置文本的字號有兩種辦法，一種是設(shè)置絕對字號，<fontsize=字號>；另一種是設(shè)置文本的相對字號；<fontsize=±n>。用第二種方法時(shí)“＋”號表示字體變大，“－”號表示字體變小。②字體風(fēng)格字體風(fēng)格分為物理風(fēng)格和邏輯風(fēng)格。物理風(fēng)格直接指定字體。<b>黑體 <i>斜體<u>下劃線 <tt>打字機(jī)體。邏輯風(fēng)格指定文本的作用。<em>強(qiáng)調(diào) <srrony>特別強(qiáng)調(diào)<code>源代碼 <samp>例子<kbd>鍵盤輸入 <var>變量<dfn>定義 <cite>引用<small>較小 <big>較大<sup>上標(biāo) <sup>下標(biāo)③字體顏色字體的顏色用<fontcolor=#>指定，#可以是6位16進(jìn)數(shù)，分別指定紅、綠、藍(lán)的值，也可以是指定的顏色名稱，例如black，olive，teal，red，blue，maroon，navy，gray，lime，fudrsia，white，green，purple，sliver，yellow，aqua之一。④閃爍<blink>文本</blink>使文本閃爍，閃爍頻率為1秒鐘一次。5）圖像圖像使你的頁面更加漂亮，但是行向圖像會導(dǎo)致網(wǎng)絡(luò)通訊量急劇增大,使訪問時(shí)間延長。所以在首頁（homepage），不宜采用很大的圖像。如果確實(shí)需要一些大圖像，最好在主頁中用一個(gè)縮小的圖像指向原圖，并標(biāo)明該圖的大小。這樣讀者可以快速地訪問您的主頁，自己選擇看還是不看那些圖像。①圖像的基本格式為<Imgsrc="image-url">或<Imgsrc="image-url"alt="text">image-url是圖像文件的url。目前，大部分瀏覽器支持.gif和.jpg文件，alt屬性告訴不支持圖像的瀏覽器用text代替該圖。②圖像與文本的對齊方式圖像在窗口中會占據(jù)一塊空間，在圖像的左右可能會有空白，不加說明時(shí)，瀏覽器將隨后的文本顯示在這些空白中，顯示的位置由align屬性指定。用align=left，right時(shí)，圖像是一個(gè)浮動(dòng)圖像。比如align=left，圖像必須挨著左邊框，它把原來占據(jù)該塊空白的文本“擠走”，或擠到它右邊，或擠到它上下。③文本與圖像的間距用vspace=#，hspace=#指定，#是整數(shù)，單位是象素，前者指定縱向間距，后者指定橫向間距。6）表格標(biāo)簽在網(wǎng)頁中做一個(gè)3欄2列的表格：第一個(gè)步驟，利用<TABLE></TABLE>標(biāo)簽告訴電腦我要做一個(gè)表格；第二個(gè)步驟，利用一組<TR></TR>標(biāo)簽先做一個(gè)橫列，然后在橫列中利用三組<TD></TD>標(biāo)簽再分出三欄；第三個(gè)步驟，重復(fù)第二個(gè)步驟，再做一橫列然后再分三欄，如此才能得到一個(gè)3欄2列的表格。下文將將該過程進(jìn)行分解講解，首先看一個(gè)最簡單的表格：原始碼呈現(xiàn)結(jié)果<TABLEBORDER=1>

<TR><TD>1</TD></TR>

</TABLE>1利用<TABLE>這個(gè)標(biāo)簽來告訴電腦，這是一個(gè)表格，至于Border=1這參數(shù)是設(shè)定此表格的框線粗細(xì)為1。一組<TR></TR>是設(shè)定一橫列的開始。一組<TD></TD>則是設(shè)定一個(gè)欄位。當(dāng)然，文字就是要擺在這里面。現(xiàn)在我們再來增加二個(gè)格子：原始碼呈現(xiàn)結(jié)果<TABLEBorder=1>

<TR><TD>1</TD><TD>2</TD><TD>3</TD></TR>

</TABLE>123<TR></TR>沒有增加，<TD></TD>卻增加了二組。那如果需要再加上一行呢？原始碼呈現(xiàn)結(jié)果<TABLEBorder=1>

<TR><TD>1</TD><TD>2</TD><TD>3</TD></TR>

<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>

</TABLE>123456合并表格欄位并非所有的表格都是規(guī)規(guī)矩矩的只有幾欄、幾列而已，有時(shí)候我們還會希望能夠“合并欄位”，讓表格更美觀、更實(shí)用一點(diǎn)，而談到“合并欄位”，我們就必須知道，合并的方向有兩種：一種是上下合并（也就是橫列間的合并），一種是左右合并（也就是直欄間的合并），這兩種合并方式各有不同的屬性設(shè)定方法。左右欄位合并：如何將1、2、3格通通合并變成一大格：原始碼呈現(xiàn)結(jié)果<TABLEBorder=1>

<TR><TDColspan=3>1</TD></TR>

<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>

</TABLE>14562、3都消失了？只剩下1，而且該欄的<TD>標(biāo)簽還多了一個(gè)Colspan="3"，這就是“左右欄位合并”的屬性，COLSPAN="3"的意思就是：這個(gè)欄位左右橫跨了3個(gè)欄位，也正因如此，本來的兩個(gè)<TD>都可以省掉了。上下欄位合并：如何上下合并，將1、4格合并變成一大格：原始碼呈現(xiàn)結(jié)果<TABLEBorder=1>

<TR><TDRowspan=2>1</TD><TD>2</TD><TD>3</TD></TR>

<TR><TD>5</TD><TD>6</TD></TR>

</TABLE>12356要合并欄位就一定有些欄位會被“犧牲”掉，這次我們要“上下合并”，我們將1與4合并成一個(gè)欄位，那么被犧牲的就是4欄位，而在1的<TD>標(biāo)簽中則多了個(gè)生面孔Rowspan，這就是“上下欄位合并”的屬性，ROWSPAN=2的意思就是：這個(gè)欄位上下連跨了2個(gè)欄位。表格欄位對齊位置設(shè)定可以自由設(shè)定表格的“寬”及“高”，下面制作一個(gè)寬100、高60的表格：原始碼呈現(xiàn)結(jié)果<TABLEWidth="100"Border="1"Height="60">

<TR><TD>1</TD></TR>

</TABLE>1文本“1”居中如何設(shè)置？加入Align=Center這參數(shù)即可：原始碼呈現(xiàn)結(jié)果<TABLEWidth="100"Border="1"Height="60">

<TR><TDAlign=Center>1</TD></TR>

</TABLE>1同理利用Align=Right可以讓表格中物件置右、利用Align=Left可以讓表格中物件置左（預(yù)設(shè)值），至于為什么要加在<TD>中呢？因?yàn)椋?lt;TD>是一個(gè)欄位的意思，我們要指定在這欄位中的東西要置中或置左置右，就必須將Align加在<TD>中。既然可以置中，那么也可以控制表格內(nèi)文字靠上方、靠下方嗎？可以的，只要利用Valign=Top這種屬性即可讓表格內(nèi)物件靠上方對齊。原始碼呈現(xiàn)結(jié)果<TABLEWidth="100"Border="1"Height="60">

<TR><TDAlign=CenterValign=Top>1</TD></TR>

</TABLE>1同理利用Valign=Middle可以讓表格中物件垂直置中（預(yù)設(shè)值），Valign=Bottom可以讓表格中物件靠下方。表格背景、底色設(shè)定表格以及表格中的單元格都可以設(shè)置背景色，效果如下：原始碼呈現(xiàn)結(jié)果<TABLEBorder="1"BgColor=#FFCC33>

<TR><TD>1</TD><TD>2</TD></TR>

<TR><TD>3</TD><TD>4</TD></TR>

</TABLE>1234同樣BgColor="顏色碼"加在<TR>中，可以指定一行的背景色。加在<TD>中則可以指定一個(gè)欄位的背景色。表格除了可以設(shè)定底色之外，也可以用圖片來作背景，只要將BackGround="圖片名稱"加到表格中即可。表格框線設(shè)定Border=“粗細(xì)值”原始碼呈現(xiàn)結(jié)果<TABLEBorder=5>

<TR><TD>1</TD></TR>

</TABLE>1設(shè)定邊框顏色，BorderColor=“顏色碼”原始碼呈現(xiàn)結(jié)果<TABLEBorder="5"BorderColor="#0080FF">

<TR><TD>1</TD></TR>

</TABLE>1表格欄距設(shè)定我們可以利用CellPadding屬性自由設(shè)定表格內(nèi)文字距離格線的距離，這個(gè)屬性很好用，保持適當(dāng)?shù)木嚯x，看起來比較舒服。一般而言內(nèi)定值為2，不過我建議設(shè)定為4比較漂亮。原始碼呈現(xiàn)結(jié)果<TABLEBorder="1"CellPadding="10">

<TR><TD>1</TD><TD>2</TD></TR>

</TABLE>12我們可以利用CellSpacing屬性設(shè)定表格欄位格線之間的距離。原始碼呈現(xiàn)結(jié)果<TABLEBorder="1"CellSpacing="5">

<TR><TD>1</TD><TD>2</TD></TR>

</TABLE>127）居中<Center>很多元素都有對齊方式屬性，如hn、p等。也可以直接用居中鏈接簽<Center>…</Center>。【例】：<H3align=center>Wonderful!!</H3><Center>Thismustbemydream.</Center>8）文字標(biāo)題（hn）標(biāo)題元素有6種，分別為H1，H2，…H6，用于表示文章中的各種題目。標(biāo)題號越小，字體越大，一般情況下，瀏覽器對標(biāo)題作如下解釋：H1黑體，特大字體，居中，上下各有兩行空行；H2黑體，大字體，上下各有一到兩行空行；H3黑體（斜體），大字體，左端微縮進(jìn)，上下空行；H4黑體，普通字體，比h3更多縮進(jìn)，上邊一空行；H5黑體（斜體），與h4相同縮進(jìn)，上邊一空行；H6黑體，與正文有相同縮進(jìn)，上邊一空行?！纠浚?lt;H2align=center>Chapter2</H2>9）分段<P>Html的瀏覽器是基于窗口的，用戶可以隨時(shí)改變顯示區(qū)的大小，所以Html將多個(gè)空格以及回車等效為一個(gè)段落，這是和絕大多數(shù)字處理器不同的。常用屬性：aligh＝#（#可以是left，center，right，其含義同上文）。【例】：<Palign=center>Thisisacenteredparagraph</P>10）分行<br>和禁止分行<nobr><br>表示在此處分行，<nobr></nobr>則通知瀏覽器，其中的內(nèi)容在一行內(nèi)顯示，若一行內(nèi)顯示不了，則超出部分被裁剪掉。<brclear=#>clear屬性標(biāo)明下一行的情況，如clear=left，表示下一行從左邊界處開始。#可以是left，right，all之一。11）預(yù)排版文本<pre>Html的輸出是基于窗口的，因而Html文件在輸出時(shí)都是要重新排版的，若確實(shí)不需要重新排版的內(nèi)容，可以用<pre>…<／pre>通知瀏覽器。瀏覽器在輸出時(shí)，對這部分內(nèi)容幾乎不做修改地輸出?！纠浚?lt;pre>pleaseuseyourcard.VISAMaster<b>Hereisanorderform.</b></pre>12）橫線（hr）橫線，一般用于分隔同一文體的不同部分。在窗口中劃一條橫線非常簡單，只要寫一個(gè)<hr>即可，橫線的寬度用<hrsize=n>指定，width=#>指n是線寬，單位是象素。例：<hrsize=10>，<hr定橫線長度，可以指定絕對線長，也可以指定橫線長度占窗口寬度的百分比?！纠浚?lt;hrwidth=50><hrwidth=50%>橫線的位置用<hralign=#>指定。#是left成right之一，left表示左端與左邊界對齊，right是右端與右邊界對齊，缺省狀態(tài)下橫線出現(xiàn)在窗口正中。三、實(shí)驗(yàn)原理、方法和手段1、實(shí)驗(yàn)原理1）利用網(wǎng)頁設(shè)計(jì)工具進(jìn)行個(gè)人網(wǎng)站首頁開發(fā)①網(wǎng)頁編輯工具的使用方法：略。②網(wǎng)頁布局方法比較可以采用層、表格以及框架三種方法進(jìn)行，目前使用比較多的是表格，利用Border=0的表格布局可控性比較強(qiáng)；而框架占用的資源比較多，例如一個(gè)上下結(jié)構(gòu)的框架網(wǎng)頁完整調(diào)用需要打開3個(gè)網(wǎng)頁；層的使用是DHTML技術(shù)中的關(guān)鍵部分，但是存在如果利用層進(jìn)行絕對定位，其主要屬性是LeftMargin與TopMargin，對于不同的分辨率顯示的在整個(gè)顯示屏中的位置不盡相同的弊端，一般不建議使用。建議整體采用表格布局，如有必要可結(jié)合框架布局以及層布局的方式，以實(shí)現(xiàn)某些特殊作用。③框架網(wǎng)頁布局下圖可以看出，一共分為1、2、3三個(gè)框架，每一個(gè)框架，各有其顯示的內(nèi)容分別是a.htm、b.htm、c.htm三個(gè)檔案。然而左下角的那個(gè)index.htm是做什么用的呢？左下角的這個(gè)檔案index.htm，就是要告訴電腦，我們要將畫面分割成這樣，也就是說，所有Frame的標(biāo)簽，其實(shí)都只擺在index.htm這個(gè)檔案里。（當(dāng)然，不是檔名一定要叫做index.htm取其他檔名也是可以的。）總之，需要分割幾個(gè)框框，就一定會有幾個(gè)對應(yīng)的html檔案（假如您要分割100個(gè)框框，就要有100個(gè)html檔就對了），另外，還會多一個(gè)檔案是來告訴電腦要如何分割的（也就是例中的index.htm檔）?！纠浚嚎蚣芫W(wǎng)頁實(shí)例<Head><Title>框窗實(shí)作</Title>

</Head>

<FrameSetCols="120,*">

<FrameSrc="a.htm"Name="1">

<FrameSetRows="100,*">

<FrameSrc="b.htm"Name="2">

<FrameSrc="c.htm"Name="3">

</FrameSet>

</FrameSet>

</Html>實(shí)際網(wǎng)頁效果2）HTML語言標(biāo)記的掌握見“實(shí)驗(yàn)內(nèi)容2”3）網(wǎng)頁設(shè)計(jì)注意事項(xiàng)①注意視覺效果一定要兼顧不同分辨率，可能采用1024*768開發(fā)的頁面非常具備吸引力，但是在800*600模式下可能因?yàn)槌霈F(xiàn)橫向或者縱向滾動(dòng)條而使其黯然失色，建議采用低分辨率開發(fā)，當(dāng)然可以在進(jìn)入頁面時(shí)判斷分辨率，根據(jù)不同的分辨率來適應(yīng)，該技術(shù)需要使用Javascript技術(shù)，將在實(shí)驗(yàn)四進(jìn)行。另外例如使用表格布局時(shí)可以將表格的Width與Height屬性按照百分比設(shè)置，表格的寬度與高度就會根據(jù)網(wǎng)頁的大小自動(dòng)收縮，這樣也會不同程度的解決分辨率不同帶來的效果不一致問題。②表格布局的建議一個(gè)網(wǎng)頁要盡量避免用整個(gè)一張大表格，所有的內(nèi)容都嵌套在這個(gè)大表格之內(nèi)，因?yàn)闉g覽器在解釋頁面的元素時(shí)，是以表格為單位逐一顯示，如果一張網(wǎng)頁是嵌套在一個(gè)大表格之內(nèi)，那么很可能造成的后果就是，當(dāng)瀏覽者敲入網(wǎng)址，他要先面對一片空白很長時(shí)間，然后所有的網(wǎng)頁內(nèi)容同時(shí)出現(xiàn)。如果必須這樣做，請使用<tBody>標(biāo)記，以便能夠使這個(gè)大表格分塊顯示。③其他建議一般情況下網(wǎng)站內(nèi)的圖片鏈接建議使用相對地址。每一個(gè)目錄中應(yīng)該包含一個(gè)缺省的html文件，文件名統(tǒng)一用index.htm2、方法和手段1）根據(jù)自己個(gè)人網(wǎng)站的規(guī)劃與設(shè)計(jì)，在網(wǎng)頁開發(fā)工具上進(jìn)行首頁的開發(fā)，建議采用Dreamweaver工具，目的是掌握網(wǎng)頁開發(fā)的技能并為以此為基礎(chǔ)進(jìn)行整個(gè)網(wǎng)站的開發(fā)奠定基礎(chǔ)；2）需要重點(diǎn)學(xué)習(xí)與掌握HTML語言，按照實(shí)驗(yàn)內(nèi)容的要求學(xué)習(xí)HTML標(biāo)記以及各自的效果，為網(wǎng)絡(luò)編程語言的學(xué)習(xí)以及電子商務(wù)系統(tǒng)的開發(fā)奠定基礎(chǔ)，此過程采用一般的文本編輯工具即可。四、實(shí)驗(yàn)組織運(yùn)行要求先由教師集中授課，講解如何進(jìn)行實(shí)驗(yàn)，然后是學(xué)生自主訓(xùn)練。五、實(shí)驗(yàn)條件1、每個(gè)學(xué)生一臺電腦、要求能通過互聯(lián)網(wǎng)訪問電子商務(wù)系統(tǒng)；2、實(shí)驗(yàn)環(huán)境：Windows98/2000/XP系統(tǒng)且瀏覽器為IE、具有Dreamweaver或FrontPage網(wǎng)頁開發(fā)工具。六、實(shí)驗(yàn)步驟1、個(gè)人網(wǎng)站首頁的開發(fā)（利用網(wǎng)頁編輯工具）1）打開網(wǎng)頁編輯工具；2）將首頁文件命名為index.htm，設(shè)置個(gè)人網(wǎng)站首頁標(biāo)題；3）根據(jù)網(wǎng)頁規(guī)劃與設(shè)計(jì)方案中對布局的設(shè)計(jì)，利用表格、框架或者層進(jìn)行網(wǎng)頁布局設(shè)計(jì)。①表格布局：利用Border=0的表格進(jìn)行布局，表格寬度盡量采用百分比形式設(shè)定，并避免整個(gè)頁面使用一個(gè)大表格進(jìn)行布局，也需避免嵌套超過4層的表格。②框架布局：需要設(shè)置好框架的整體網(wǎng)頁屬性，包括各框架的寬度、高度（建議使用百分比）、框架是否可改變大?。ㄈ绻枰梢愿淖兇笮?，布局采用框架是個(gè)很好的方案）③層布局：在沒有系統(tǒng)學(xué)習(xí)CSS技術(shù)之前采用層需要熟悉掌握網(wǎng)頁編輯工具中對層屬性的設(shè)定方法，在Dreamweaver中可以方便的設(shè)置其位置（左邊距、上邊距）\層的大小以及背景色等外觀屬性等。4）設(shè)置網(wǎng)站的欄目并進(jìn)行適當(dāng)?shù)男薷母鶕?jù)網(wǎng)站規(guī)劃設(shè)計(jì)中對欄目的設(shè)計(jì)編輯網(wǎng)站的欄目，可以以導(dǎo)航圖形或者導(dǎo)航欄等形式出現(xiàn)，要突出主題，適當(dāng)考慮要有新意。①圖像的收集與修改圖像可以從網(wǎng)上或者其他渠道收集，也可適當(dāng)采用Photoshop或者Firework工具進(jìn)行修改，本課程不單獨(dú)設(shè)置實(shí)驗(yàn)進(jìn)行學(xué)習(xí)，將在實(shí)驗(yàn)過程中適當(dāng)講解圖像文字的插入；圖像的簡單編輯、截??；圖像效果的設(shè)置等的簡單方法。②圖像的插入實(shí)現(xiàn)使用網(wǎng)頁編輯工具插入圖像，圖像的連接地址（Src）建議采用相對地址；并設(shè)置圖像的相關(guān)屬性，例如寬度高度（建議如果沒有特殊需要，以默認(rèn)為準(zhǔn)，不需單獨(dú)設(shè)置）、提示、邊框（建議設(shè)置為0）等。③欄目名稱文字的輸入與修飾實(shí)現(xiàn)使用網(wǎng)頁編輯工具插入欄目文字（所見即所得，直接錄入即可），需要設(shè)置文字相關(guān)屬性，例如大小、顏色、字體以及行距等。5）補(bǔ)充網(wǎng)頁內(nèi)容元素，基本包括文字、圖像等，并適當(dāng)修飾根據(jù)收集來的網(wǎng)頁首頁的內(nèi)容資料補(bǔ)充網(wǎng)頁內(nèi)容，基本元素包括文字、圖像等，插入圖像、文字的步驟見步驟4）中描述。6）采用Maquee、Javascript效果或者Flash動(dòng)態(tài)等元素充實(shí)美化頁面①M(fèi)arquee是設(shè)置網(wǎng)頁滾動(dòng)文字（或者圖像）的對象，可以設(shè)置其滾動(dòng)速度、滾動(dòng)方向以及是否循環(huán)滾動(dòng)等，F(xiàn)rontPage工具中“插入字幕”即為該效果；②Javascript效果的使用有時(shí)會給網(wǎng)頁起到畫龍點(diǎn)睛的作用，但過量的使用會影響網(wǎng)頁速度，有時(shí)類似于彈出窗口等會造成瀏覽者的厭煩情緒，所以需要合理使用該技術(shù)，在實(shí)驗(yàn)四中將對該技術(shù)具體講解。③FlashMX可以用來開發(fā)豐富Internet內(nèi)容和應(yīng)用程序，可以采用嵌入的FlashPlayer播放，該技術(shù)難度較大，本課程不做過多的涉及，如果有興趣可以參考相關(guān)資料自行學(xué)習(xí)。7）網(wǎng)頁其他元素可適當(dāng)考慮增加背景音樂等元素；在網(wǎng)頁布局中可以添加水平線起到間隔的作用等等，可以根據(jù)實(shí)際需要使用網(wǎng)頁編輯工具中的其他輔助項(xiàng)目為網(wǎng)頁增添色彩。2、在進(jìn)行首頁開發(fā)的同時(shí)，能掌握HTML標(biāo)記的運(yùn)用利用網(wǎng)頁編輯工具中提供的HTML視圖，調(diào)試在“實(shí)驗(yàn)內(nèi)容”中列出的HTML標(biāo)記及對應(yīng)標(biāo)記的屬性，并查看標(biāo)記具體效果。七、思考題1、網(wǎng)頁設(shè)計(jì)工具使用與HTML語言掌握的關(guān)系？2、網(wǎng)頁表格與WORD中表格的區(qū)別？3、在實(shí)際網(wǎng)頁開發(fā)過程中，是否有納入規(guī)劃設(shè)計(jì)方案但發(fā)現(xiàn)難以實(shí)現(xiàn)的內(nèi)容？具體有哪些？4、網(wǎng)站首頁為何必須設(shè)置為index.htm文件名，組織好的各文件夾中最好需要有一個(gè)index.htm，為什么？八、實(shí)驗(yàn)要求1、實(shí)驗(yàn)預(yù)習(xí)1）認(rèn)真學(xué)習(xí)網(wǎng)頁編輯工具的使用，主要是如何插入圖形、文本等對象以及進(jìn)行適當(dāng)?shù)男揎?；表格對象的控制；以及?dòng)態(tài)相關(guān)效果的設(shè)置等；2）需要對HTML語言根據(jù)實(shí)驗(yàn)內(nèi)容要求預(yù)習(xí)相關(guān)標(biāo)記的使用。2、實(shí)驗(yàn)記錄無3、實(shí)驗(yàn)報(bào)告1）填寫課程名稱，實(shí)驗(yàn)日期。2）填寫學(xué)生所在的班級、學(xué)號、姓名3）實(shí)驗(yàn)報(bào)告部分為主體部分①主要填寫根據(jù)網(wǎng)頁規(guī)劃與設(shè)計(jì)的內(nèi)容進(jìn)行網(wǎng)頁開發(fā)過程的步驟和網(wǎng)頁的執(zhí)行效果；②根據(jù)實(shí)驗(yàn)內(nèi)容學(xué)習(xí)HTML標(biāo)記語言的步驟以及網(wǎng)頁執(zhí)行結(jié)果；③最后需要寫的是自己的實(shí)驗(yàn)體會和收獲。4）成績一欄和最后的指導(dǎo)教師評語為教師填寫。九、其它說明必要時(shí)對上述相關(guān)內(nèi)容進(jìn)行補(bǔ)充，或告知學(xué)生實(shí)驗(yàn)室管理的相關(guān)規(guī)定及安全事項(xiàng)等內(nèi)容。

實(shí)驗(yàn)四：個(gè)人網(wǎng)站全面開發(fā)并上傳實(shí)驗(yàn)學(xué)時(shí)：4實(shí)驗(yàn)類型：（設(shè)計(jì)） 實(shí)驗(yàn)要求：（必修）一、實(shí)驗(yàn)?zāi)康慕Y(jié)合第二章電子商務(wù)表達(dá)層中關(guān)于靜態(tài)網(wǎng)頁、動(dòng)態(tài)網(wǎng)頁（客戶端應(yīng)用體系結(jié)構(gòu)以及客戶端腳本體系結(jié)構(gòu)）開發(fā)技術(shù)的學(xué)習(xí)，能按照實(shí)驗(yàn)二中規(guī)劃的內(nèi)容，以實(shí)驗(yàn)三網(wǎng)站首頁開發(fā)為起點(diǎn)全面完成個(gè)人網(wǎng)站的開發(fā)，并申請個(gè)人網(wǎng)站空間實(shí)現(xiàn)網(wǎng)站的上傳，從而完整掌握一個(gè)網(wǎng)站從設(shè)計(jì)、開發(fā)實(shí)現(xiàn)到上傳的完整過程，為以此為基礎(chǔ)進(jìn)行的電子商務(wù)系統(tǒng)邏輯層的設(shè)計(jì)開發(fā)做好鋪墊。二、實(shí)驗(yàn)內(nèi)容1、根據(jù)個(gè)人網(wǎng)站的規(guī)劃設(shè)計(jì)的內(nèi)容，以實(shí)驗(yàn)二中個(gè)人網(wǎng)站首頁開發(fā)為起點(diǎn)完成整個(gè)網(wǎng)站的開發(fā)，要求整體符合規(guī)劃。要求完整完成對Dreamweaver或Frontpage網(wǎng)頁編輯工具的掌握以及對圖形適當(dāng)?shù)奶幚砑记伞?、HTML標(biāo)記——在進(jìn)行網(wǎng)站開發(fā)的同時(shí)，能完成對HTML超級鏈接等的標(biāo)記的運(yùn)用掌握1）超文本鏈接指針一個(gè)超文本鏈接指針由兩部分組成。一是被指向的目標(biāo)，它可以是同一文件的另一部分，也可以是世界另一端的一個(gè)文件，還可以是動(dòng)畫或音樂；另一部分是指向目標(biāo)的鏈接指針。①指向一個(gè)目標(biāo)<a>在html文件中用鏈接指針指向一個(gè)目標(biāo)。其基本格式為：<ahref="url">字符串</a>href屬性中的統(tǒng)一資源定位器（url）是被指向的目標(biāo)，隨后的“字符串”在html文件中充當(dāng)指針的角色，它一般顯示為藍(lán)色。當(dāng)讀者用鼠標(biāo)點(diǎn)這個(gè)字符串時(shí)，瀏覽器就會將url處的資源顯示在屏幕上。【例】：<ahref="">搜狐</a>用戶用鼠標(biāo)點(diǎn)取“搜狐”，即可看到搜狐網(wǎng)站主頁。在這個(gè)例子中，充當(dāng)指針的是搜狐，同樣我們也可以用圖像作為鏈接指針。在編寫html文件時(shí)，需要知道目標(biāo)的url。如何才能得到目標(biāo)的url呢？對于自己主機(jī)內(nèi)的文件，它的url可以根據(jù)該文件的實(shí)際情況決定。對于Internet上的資源，我們在用瀏覽器觀看時(shí)，它的url會在瀏覽器的Location一欄中顯示出來，把它抄下來寫到你的html文件中即可。在編寫html文件時(shí)，對有能確定關(guān)系的一組資源（比如在同一個(gè)目錄中）應(yīng)采用相對url，這不僅簡化你的html文件，而且便于維護(hù)。比如當(dāng)你需要將某個(gè)目錄整個(gè)搬到另外一個(gè)地方或把某一主機(jī)的資源移到另一臺主機(jī)時(shí)，用相對url寫的html文件用不看更新其中的url（只要它們的相對關(guān)系沒有改變）。但如果你用絕對url編寫html，你就不得不逐字修改每個(gè)鏈接指針中的url，這是一件很乏味也很容易出錯(cuò)的工作。對于各個(gè)資源之間沒有固定的關(guān)系，比如你的html文件是介紹各大學(xué)情況的，它所指向的目標(biāo)分布在全球的主機(jī)中，這時(shí)你就只能用絕對url了。圖像鏈接指針圖像也可以做為鏈接指針。格式為：<ahref="url"><Imgsrc="url"></a>可以看出，上例中用<Imgsrc="url">取代了鏈接指針中text的位置。<Imgsrc="url">是圖像元素，它表明顯示url代表的圖像文件，參見圖像一章。屬性：目標(biāo)窗口如果希望被指向的目標(biāo)在一個(gè)新的窗口中顯示，可以使用target屬性來修飾鏈接指針元素。<ahref="url"target="window-name">text</a>將url代表的資源顯示在一個(gè)新的窗口中，該窗口的名字叫window-name。2）轉(zhuǎn)義字將與特殊字符html中<，>，&有特殊含義，（前兩個(gè)字符用于鏈接簽，&用于轉(zhuǎn)義），不能直接使用。使用這三個(gè)字符時(shí)，應(yīng)使用它們的轉(zhuǎn)義序列。&的轉(zhuǎn)義序列為&s或&<的轉(zhuǎn)義序列為≪<>的轉(zhuǎn)義序列為>>前者為字符轉(zhuǎn)義序列，后者為數(shù)字轉(zhuǎn)義序列。例如≪font>顯示為<font>，若直接寫為<font>則被認(rèn)為是一個(gè)鏈接簽。需要說明的是：--轉(zhuǎn)義序列各字符間不能有空格；--轉(zhuǎn)義序列必須以“;”結(jié)束；--單獨(dú)的&不被認(rèn)為是轉(zhuǎn)義開始。如“≪”被解釋為“≪”而不是<；另一個(gè)需要轉(zhuǎn)義的字符是引號，它的轉(zhuǎn)義序列為"""或"""，如：<Imgsrc="image.gif"alt="A"real"example">html使用的字符集是ISO&859Larin-1字符集，該字符集中有許多標(biāo)準(zhǔn)鍵盤上無法輸入的字符。對這些特殊字符只能使用轉(zhuǎn)義序列。3、DHTML——掌握網(wǎng)頁開發(fā)中樣式表技術(shù)的使用1）概念CSS是CascadingStyleSheet的縮寫，譯作“層疊樣式表單”。是用于增強(qiáng)控制網(wǎng)頁樣式并允許將樣式信息與網(wǎng)頁內(nèi)容分離的一種標(biāo)記性語言。2）樣式表加入網(wǎng)頁的方法①鏈入外部樣式表文件(LinkingtoaStyleSheet)先建立外部樣式表文件（.css），然后使用HTML的link對象?！纠浚?lt;Head>

<Title>titleofarticle</Title>

<linkrel=stylesheethref="/rainer.css"type="text/css">

</Head>②定義內(nèi)部樣式塊對象(EmbeddingaStyleBlock)在HTML文檔的<Html>和<Body>標(biāo)記之間插入一個(gè)<STYLE>...</STYLE>塊對象。【例】：<Html>

<styletype="text/css">

<!--

body{font:10pt"Arial"}

h1{font:15pt/17pt"Arial";font-weight:bold;color:maroon}

h2{font:13pt/15pt"Arial";font-weight:bold;color:blue}

p{font:10pt/12pt"Arial";color:black}

-->

</style>

<Body>請注意，這里將style對象的type屬性設(shè)置為"text/css"，是允許不支持這類型的瀏覽器忽略樣式表單。③內(nèi)聯(lián)定義(InlineStyles)內(nèi)聯(lián)定義即是在對象的標(biāo)記內(nèi)使用對象的style屬性定義適用其的樣式表屬性?！纠浚?lt;Pstyle="margin-left:0.5in;margin-right:0.5in">這一行被增加了左右的外補(bǔ)丁</P>3）樣式表語法(CSSSyntax)Selector{property:value}參數(shù)說明：Selector

--

選擇符property

:

value

--

樣式表定義。屬性和屬性值之間用冒號(:)隔開。定義之間用分號(;)隔開4）樣式表實(shí)例【例】：樣式表實(shí)例<Html><Head><STYLETYPE="text/css"><!--H3{text-decoration:underline;font-size:37px;font-family:impact}--></STYLE></Head><Body><H3>Stylesheets</H3></Body></Html>實(shí)現(xiàn)效果：Stylesheets通過實(shí)驗(yàn)掌握運(yùn)用CSS樣式表的方法，建議采用鏈入外部樣式表文件的方式將樣式表加入網(wǎng)頁。4、客戶端應(yīng)用體系結(jié)構(gòu)1）JavaApplet是Java語言編寫的包含在網(wǎng)頁里的“小應(yīng)用程序”，必須嵌入HTML文件中，由瀏覽器解釋之后作為網(wǎng)頁的一部分來執(zhí)行。實(shí)驗(yàn)指導(dǎo)教師演示JavaApplet實(shí)現(xiàn)煙花效果，主要突出其Class是脫離網(wǎng)頁存在的方式，當(dāng)客戶瀏覽時(shí)，Applet隨著網(wǎng)頁一起下載到客戶端瀏覽器中，并借助瀏覽器中的Java虛擬機(jī)運(yùn)行工作，要求能按照相應(yīng)步驟調(diào)用對應(yīng)的Applet小程序執(zhí)行并查看效果。2）ActiveX是下載到IE，并在客戶端執(zhí)行的功能完全的程序，只能在Windows環(huán)境下工作，演示插入Office圖表控件并要求能運(yùn)用1-2個(gè)網(wǎng)頁編輯工具提供的ActiveX控件。5、客戶端腳本體系結(jié)構(gòu)（Javascript）——了解并部分掌握客戶端體系結(jié)構(gòu)Javascript腳本技術(shù)1）基本概念Javascript是一種可以嵌入HTML頁面、基于對象的解釋性語言。借助Javascript語言，可以在不需要網(wǎng)絡(luò)傳輸資料的情況下，響應(yīng)使用者的需求事件，所以當(dāng)一位使用者輸入一項(xiàng)資料時(shí)，它不用經(jīng)過傳給服務(wù)端處理，再傳回來的過程，而直接可以被客戶端的應(yīng)用程序所處理。Javascript是一種腳本語言，它采用小程序段的方式實(shí)現(xiàn)編程。像其它腳本語言一樣，具有自身的數(shù)據(jù)類型、表達(dá)式和算術(shù)運(yùn)算符及程序的基本框架結(jié)構(gòu)。2）簡單實(shí)例【例】：Javascript簡單實(shí)例<Html><Head><ScriptLanguage="Javascript">//JavascriptAppearshere.alert("這是第一個(gè)Javascript程序!");</Script></Head></Html>實(shí)現(xiàn)效果：說明：是HTML文檔，其標(biāo)識格式為標(biāo)準(zhǔn)的HTML格式；如同HTML標(biāo)識語言一樣，Javascript程序代碼是一些可用字處理軟件瀏覽的文本，它在描述頁面的HTML相關(guān)區(qū)域出現(xiàn)，可將<Script>...</Script>標(biāo)識放入Head>..</Head>或<Body>...</Body>之間。將Javascript標(biāo)識放置<Head>...</Head>在頭部之間，使之在主頁和其余部分代碼之前裝載，從而可使代碼的功能更強(qiáng)大；可以將Javascript標(biāo)識放置在<Body>...</Body>主體之間以實(shí)現(xiàn)某些部分動(dòng)態(tài)地創(chuàng)建文檔；Javascript代碼由<ScriptLanguage="Javascript">...</Script>說明。在標(biāo)識<ScriptLanguage="Javascript">...</Script>之間就可加入Javascript腳本；alert()是Javascript的窗口對象方法，其功能是彈出一個(gè)具有“確定”對話框并顯示（）中字符串的窗口；通過<!--...//-->標(biāo)識說明：若不認(rèn)識Javascript代碼的瀏覽器，則所有在其中的標(biāo)識均被忽略；若認(rèn)識，則執(zhí)行其結(jié)果。使用注釋這是一個(gè)好的編程習(xí)慣，它使其他人可以讀懂你的語言；Javascript以</Script>標(biāo)簽結(jié)束。3）學(xué)習(xí)JavaScirpt的基本知識并學(xué)習(xí)簡單的運(yùn)用能掌握J(rèn)avascript語言的基本知識（數(shù)據(jù)類型、對象的概念、函數(shù)及事件驅(qū)動(dòng)機(jī)制）等，并能運(yùn)用瀏覽器對象以及窗口對象適當(dāng)增加網(wǎng)站的互動(dòng)性。能借鑒成熟的Javascript實(shí)例并經(jīng)過適當(dāng)修改后運(yùn)用到個(gè)人網(wǎng)站中，以增加網(wǎng)頁整體效果。6、申請免費(fèi)網(wǎng)站空間，并通過Web或者FTP形式發(fā)布個(gè)人網(wǎng)站。三、實(shí)驗(yàn)原理、方法和手段1、實(shí)驗(yàn)原理1）HTML標(biāo)記——超級鏈接技術(shù)（見“實(shí)驗(yàn)內(nèi)容1”2）客戶端應(yīng)用體系結(jié)構(gòu)①JavaApplet 見“實(shí)驗(yàn)內(nèi)容4-1②ActiveX 見“實(shí)驗(yàn)內(nèi)容4-23）客戶端腳本體系結(jié)構(gòu)Javascript見“實(shí)驗(yàn)內(nèi)容5”。①Javascript的基本數(shù)據(jù)結(jié)構(gòu)在Javascript中四種基本的數(shù)據(jù)類型：數(shù)值（整數(shù)和實(shí)數(shù)）、字符串型（用“”號或‘’括起來的字符或數(shù)值）、布爾型（使True或False表示）和空值。在Javascript的基本類型中的數(shù)據(jù)可以是常量，也可以變量。由于Javascript采用弱類型的形式，因而一個(gè)數(shù)據(jù)的變量或常量不必首先作聲明，而是在使用或賦值時(shí)確定其數(shù)據(jù)的類型的。當(dāng)然也可以先聲明該數(shù)據(jù)的類型，它是通過在賦值時(shí)自動(dòng)說明其數(shù)據(jù)類型的。②Javascript的程序構(gòu)成if條件語句、For循環(huán)語句、while循環(huán)③Javascript中的函數(shù)Function函數(shù)名（參數(shù),變元）{函數(shù)體;Return表達(dá)式;}④Javascript的事件驅(qū)動(dòng)和事件處理Javascript是基于對象(object-based)的語言。這與Java不同,Java是面向?qū)ο蟮恼Z言。而基于對象的基本特征，就是采用事件驅(qū)動(dòng)(event-driven)。它是在用形界面的環(huán)境下，使得一切輸入變化簡單化。通常鼠標(biāo)或熱鍵的動(dòng)作我們稱之為事件（Event），而由鼠標(biāo)或熱鍵引發(fā)的一連串程序的動(dòng)作，稱之為事件驅(qū)動(dòng)（EventDriver）。而對事件進(jìn)行處理程序或函數(shù)，我們稱之為事件處理程序（EventHandler）。事件處理程序在Javascript中對象事件的處理通常由函數(shù)(Function)擔(dān)任。其基本格式與函數(shù)全部一樣，可以將前面所介紹的所有函數(shù)作為事件處理程序。格式如下：Function事件處理名（參數(shù)表）{事件處理語句集；……}事件驅(qū)動(dòng)Javascript事件驅(qū)動(dòng)中的事件是通過鼠標(biāo)或熱鍵的動(dòng)作引發(fā)的。它主要有以下幾個(gè)事件：（1）單擊事件onClick當(dāng)用戶單擊鼠標(biāo)按鈕時(shí)，產(chǎn)生onClick事件。同時(shí)onClick指定的事件處理程序或代碼將被調(diào)用執(zhí)行。通常在下列基本對象中產(chǎn)生：button（按鈕對象）checkbox（復(fù)選框）或（檢查列表框）radio（單選鈕）resetbuttons（取消按鈕）submitbuttons（提交按鈕）在onClick等號后，可以使用自己編寫的函數(shù)作為事件處理程序，也可以使用Javascript中內(nèi)部的函數(shù)。還可以直接使用Javascript的代碼等。（2）onChange改變事件當(dāng)利用text或texturea元素輸入字符值改變時(shí)發(fā)該事件，同時(shí)當(dāng)在select表格項(xiàng)中一個(gè)選項(xiàng)狀態(tài)改變后也會引發(fā)該事件。（3）選中事件onSelect當(dāng)Text或Textarea對象中的文字被加亮后，引發(fā)該事件。（4）獲得焦點(diǎn)事件onFocus當(dāng)用戶單擊Text或textarea以及select對象時(shí)，產(chǎn)生該事件。此時(shí)該對象成為前臺對象。（5）失去焦點(diǎn)onBlur當(dāng)text對象或textarea對象以及select對象不再擁有焦點(diǎn)、而退到后臺時(shí)，引發(fā)該文件，他與onFocus事件是一個(gè)對應(yīng)的關(guān)系。（6）載入文件onLoad當(dāng)文檔載入時(shí)，產(chǎn)生該事件。onLoad一個(gè)作用就是在首次載入一個(gè)文檔時(shí)檢測cookie的值，并用一個(gè)變量為其賦值，使它可以被源代碼使用。（7）卸載文件onUnload當(dāng)Web頁面退出時(shí)引發(fā)onUnload事件，并可更新Cookie的狀態(tài)。⑤瀏覽器對象層次及其主要作用編程人員利用以下這些對象，可以對WWW瀏覽器環(huán)境中的事件進(jìn)行控制并作出處理。在Javascript中提供了非常豐富的內(nèi)部方法和屬性，從而減輕了編程人員的工作，提高編程效率，這正是基于對象與面向?qū)ο蟮母緟^(qū)別所在。瀏覽器對象(Navigator)：提供有關(guān)瀏覽器的信息；窗口對象(Windows)：Window對象處于對象層次的最頂端，它提供了處理Navigator窗口的方法和屬性；位置對象(Location)：Location對象提供了與當(dāng)前打開的URL一起工作的方法和屬性，它是一個(gè)靜態(tài)的對象；歷史對象(History)：History對象提供了與歷史清單有關(guān)的信息；文檔對象(Document)：document對象包含了與文檔元素(elements)一起工作的對象，它將這些元素封裝起來供編程人員使用。在這些對象系統(tǒng)中，文檔對象屬于非常重要的，它位于最低層，但對于我們實(shí)現(xiàn)Web頁面信息交互起作關(guān)鍵作用，因而它是對象系統(tǒng)的核心部分。文檔對象包含的內(nèi)容：LinksAnchorFormMethodProp鏈接對象錨對象窗體對象方法對象Document對象的主要作用就是將以上的基本元素（如links,anchor等）包裝起來，提供給編程人員使用。從另一個(gè)角度看，Document對象又是由屬性和方法組成。⑥窗口對象以及輸入/輸出應(yīng)用Javascript是基于對象的腳本編程語言，那么它的輸入輸出就是通過對象來完成的。其中有關(guān)輸入可通過窗口（Window）對象來完成，而輸出可通過文檔（document）對象的方法來實(shí)現(xiàn)。請看下面例子：【例】：窗口輸入輸出實(shí)例<Html><Head><scriptlanguaga="Javascript">Vartest=mpt("請輸入數(shù)據(jù):");document.write(test+"Javascript輸入輸出的例子");</script></Head></Html>其中mpt()就是一個(gè)窗口對象的方法，其基本作用是，當(dāng)裝入Web頁面時(shí)在屏幕上顯示一個(gè)具有“確定”和“取消”的對話框，讓你輸出數(shù)據(jù)。document.writle是一個(gè)文檔對象的方法，它的基本功能，是實(shí)現(xiàn)Web頁面的輸出顯示。（1）窗口對象該對象包括許多有用的屬性、方法和事件驅(qū)動(dòng)程序，編程人員可以利用這些對象控制瀏覽器窗口顯示的各個(gè)方面，如對話框、框架等。在使用應(yīng)注意以下幾點(diǎn)：該對象對應(yīng)于HTML文檔中的<Body>和<FrameSet>兩種標(biāo)識；onload和onunload都是窗口對象屬性；在Javascript腳本中可直接引用窗口對象。如：window.alert("窗口對象輸入方法")可直接使用以下格式：alert("窗口對象輸入方法")（2）窗口對象的事件驅(qū)動(dòng)窗口對象主要有裝入Web文檔事件onload和卸載時(shí)onunload事件。用于文檔載入和停止載入時(shí)開始和停止更新文檔。（3）窗口對象的方法窗口對象的方法主要用來提供信息或輸入數(shù)據(jù)以及創(chuàng)建一個(gè)新的窗口。創(chuàng)建一個(gè)新窗口open()使用window.open（參數(shù)表）方法可以創(chuàng)建一個(gè)新的窗口。其中參數(shù)表提供有窗口的主要特性和文檔及窗口的命名，具體參數(shù)參見“（5）輸出流及文檔對象”。具有OK按鈕的對話框alert()方法能創(chuàng)建一個(gè)具有OK按鈕的對話框。具有OK和Cancel按鈕的對話框confirm()方法為編程人員提供一個(gè)具有兩個(gè)按鈕的對話框。具有輸入信息的對話框prompt()方法允許用戶在對話框中輸入信息，并可使用默認(rèn)值，其基本格式如下：prompt（“提示信息”，默認(rèn)值）。（4）窗口對象中的屬性窗口對象中的屬性主要用來對瀏覽器中存在的各種窗口和框架的引用，其主要屬性有以下幾個(gè)：frames確文檔中幀的數(shù)目frames（幀）作為實(shí)現(xiàn)一個(gè)窗口的分隔操作，起到非常有用的作用，在使用注意以下幾點(diǎn)：--frames屬性是通過HTML標(biāo)識<Frames>的順序來引用的，它包含了一個(gè)窗口中的全部幀數(shù)。--幀本身已是一類窗口，繼承了窗口對象所有的全部屬性和方法。Parent指明當(dāng)前窗口或幀的父窗口。defaultstatus:默認(rèn)狀態(tài)，它的值顯示在窗口的狀態(tài)欄中。status:包含文檔窗口中幀中的當(dāng)前信息。top:包括的是用以實(shí)現(xiàn)所有的下級窗口的窗口。window.指的是當(dāng)前窗口self:引用當(dāng)前窗口。（5）輸出流及文檔對象在Javascript文檔對象中，提供了用于顯示關(guān)閉、消除、打開HTML頁面的輸出流。創(chuàng)建新文檔open()方法使用document.open()創(chuàng)建一個(gè)新的窗口或在指定的命令窗口內(nèi)打開文檔。由于窗口對象是所加載的父對象,因而我們在調(diào)用它的屬性或方法時(shí),不需要加入Window對象。例用Window.Open()與Open()是一樣的。

打開一個(gè)窗口的基本格式：Window.open("URL","窗口名字","窗口屬性"]window屬性參數(shù)是由一個(gè)字符串列表項(xiàng)它由逗號分隔，它指明了有關(guān)新創(chuàng)建窗口的屬性。參數(shù)設(shè)定值含義toolbaryes/no建立或不建立標(biāo)準(zhǔn)工具條locationyes/no建立或不建立位置輸入字段directionsyes/no建立或不建立標(biāo)準(zhǔn)目錄按鈕statusyes/no建立或不建立狀態(tài)條menubaryes/no建立或不建立菜單條scrollbaryes/no建立或不建立滾動(dòng)條revisableyes/no能否改變窗口大小widthyes/no確定窗口的寬度Heightyes/no確定窗口的高度。在使用Open()方法時(shí)，需要注意以下點(diǎn)：通常瀏覽器窗中，總有一個(gè)文檔是打開的；在完成對Web文檔的寫操作后，要使用或調(diào)用close()方法來實(shí)現(xiàn)對輸出流的關(guān)閉；在使用open()來打開一個(gè)新流時(shí)，可為文檔指定一個(gè)有效的文檔類型，有效文檔類型包括text/HTML、text/gif、text/xim、text/plugin等。write()、writeln()輸出顯示該方法主要用來實(shí)現(xiàn)在Web頁面上顯示輸出信息。在實(shí)際使用中，需注意以下幾點(diǎn)：writeln()與write()唯一不同之處在于在未尾加了一個(gè)換符；為了正常顯示其輸出信息，必須指明<pre></Pre>標(biāo)記，使之告訴編輯器；輸出的文檔類型，可以由瀏覽器中的有效的合法文本類型所確定。關(guān)閉文檔流close()在實(shí)現(xiàn)多個(gè)文檔對象中，必須使用close()來關(guān)閉一個(gè)對象后，才能打開另一個(gè)文檔對象。清除文檔內(nèi)容clear()使用該方法可清除已經(jīng)打開文檔的內(nèi)容。4）客戶端腳本體系結(jié)構(gòu)——DHTML/CSS 見“實(shí)驗(yàn)內(nèi)容2”。采用層疊式樣式表的優(yōu)點(diǎn)：可以只通過修改一個(gè)文件就改變頁數(shù)不定的網(wǎng)頁的外觀和格式；可以保證在所有瀏覽器和平臺之間的兼容性；更少的編碼、更少的頁數(shù)和更快的下載速度。5）網(wǎng)站發(fā)布目前常用協(xié)議是HTTP和FTP。其中HTTP主要用于下載數(shù)據(jù)，但是也可以使用HTTP來上載數(shù)據(jù)；FTP是傳統(tǒng)傳輸協(xié)議，主要用于上傳和從Internet上下載文件，與HTTP相比，它的傳輸速度明顯要快得多，同時(shí)它可以向未安裝服務(wù)器擴(kuò)展的服務(wù)器上發(fā)布站點(diǎn)。使用FTP作為傳輸協(xié)議時(shí)，可以使用專門的FTP軟件（例如Cuteftp）來傳輸，也可以采用網(wǎng)站提供的程序方式或者類似Frontpage中的站點(diǎn)發(fā)布功能來發(fā)布站點(diǎn)（實(shí)際也是使用FTP協(xié)議）。2、方法和手段根據(jù)個(gè)人網(wǎng)站的規(guī)劃與設(shè)計(jì)，在網(wǎng)站首頁開發(fā)的基礎(chǔ)上建立欄目鏈接，并完成整個(gè)網(wǎng)站的開發(fā)，在此過程中完整掌握Dreamweaver或Frontpage網(wǎng)頁開發(fā)工具；并要求通過CSS樣式表控制網(wǎng)站的整體風(fēng)格；要求適當(dāng)采用客戶端體系結(jié)構(gòu)以及Javascript技術(shù)加強(qiáng)網(wǎng)站的動(dòng)態(tài)效果，特別是后者需要重點(diǎn)加強(qiáng)運(yùn)用。具體要求：網(wǎng)站開發(fā)過程中要求注意緊扣主題、界面美觀、內(nèi)容豐富；頁面中的圖片要使用合理，盡量不要使用太大的圖片，也不要使用過多圖片，圖片顯示要正確有效（建議使用相對地址）；文件夾的組織要求清晰有條理；各個(gè)頁面之間的鏈接要合理有效；必要時(shí)用手工優(yōu)化代碼，不要產(chǎn)生過多的垃圾代碼。四、實(shí)驗(yàn)組織運(yùn)行要求學(xué)生自主訓(xùn)練為主。五、實(shí)驗(yàn)條件1、每個(gè)學(xué)生一臺電腦、要求能通過互聯(lián)網(wǎng)訪問電子商務(wù)系統(tǒng)；2、實(shí)驗(yàn)環(huán)境：Windows98/2000/XP系統(tǒng)且瀏覽器為IE、具有Dreamweaver或FrontPage網(wǎng)頁開發(fā)工具。六、實(shí)驗(yàn)步驟1、根據(jù)個(gè)人網(wǎng)站的規(guī)劃設(shè)計(jì)的內(nèi)容，以實(shí)驗(yàn)二中個(gè)人網(wǎng)站首頁開發(fā)為起點(diǎn)完成整個(gè)網(wǎng)站的開發(fā)，要求整體符合規(guī)劃。1）設(shè)置首頁的欄目鏈接；2）設(shè)計(jì)整個(gè)網(wǎng)站的目錄結(jié)構(gòu)，建議設(shè)置Images文件夾放置圖片文件，設(shè)置CSS以及JS文件夾放置CSS樣式表文件以及Javascript腳本文件，文件夾組織要求層次不超過三層，邏輯清晰；3）收集、整理和編輯網(wǎng)站需要的圖片素材以及內(nèi)容資料，適當(dāng)?shù)臅r(shí)候?qū)D片進(jìn)行一定的處理；4）網(wǎng)站中的整體風(fēng)格（BODY、TABLE等HTML標(biāo)記的風(fēng)格要求使用CSS樣式表進(jìn)行設(shè)置），此外可以使用CSS樣式表實(shí)現(xiàn)其他相關(guān)樣式以及動(dòng)態(tài)效果；5）按照欄目順序逐個(gè)進(jìn)行網(wǎng)頁編輯，要求風(fēng)格統(tǒng)一、緊扣主題、特色鮮明，文件名盡量采用建議命名方式；6）針對網(wǎng)站的特點(diǎn)采用Javascript技術(shù)設(shè)置人性化的互動(dòng)環(huán)節(jié)；例如顯示問候、當(dāng)前日期顯示等等；7）根據(jù)網(wǎng)站需要加入動(dòng)態(tài)效果，建議采用客戶端腳本——Javascript實(shí)現(xiàn)，也可以采用客戶端應(yīng)用（JavaApplet、ActiveX）以及Flash等其他技術(shù)實(shí)現(xiàn)。2、申請網(wǎng)站空間并完成網(wǎng)站上傳1）申請免費(fèi)網(wǎng)站空間；2）將發(fā)布個(gè)人網(wǎng)站，通過FTP方式實(shí)現(xiàn)，可以采用空間提供的方式，也可以采用CuteFtp等工具實(shí)現(xiàn)上傳，確保網(wǎng)站發(fā)布后圖片以及鏈接訪問正確。七、思考題1、CSS樣式表與直接使用HTML標(biāo)記設(shè)置屬性區(qū)別在哪？2、請說明自己的網(wǎng)站文件夾組織方式以及這樣設(shè)置的原因。3、請說明Javascript實(shí)現(xiàn)顯示日期時(shí)間與服務(wù)端程序設(shè)置顯示日期時(shí)間的異同？4、在網(wǎng)站開發(fā)過程中需要將超級鏈接的地址以及圖片地址設(shè)置為相對地址，為什么？八、實(shí)驗(yàn)要求1、實(shí)驗(yàn)預(yù)習(xí)1）鞏固網(wǎng)頁編輯工具的學(xué)習(xí)；2）在實(shí)驗(yàn)三的基礎(chǔ)上預(yù)習(xí)HTML語言超級鏈接的使用；3）根據(jù)實(shí)驗(yàn)內(nèi)容預(yù)習(xí)CSS的基本概念以及樣式表的使用；4）學(xué)習(xí)Javascript的基本知識以及語言相關(guān)內(nèi)容；5）學(xué)習(xí)網(wǎng)站上傳的相關(guān)知識。2、實(shí)驗(yàn)記錄無3、實(shí)驗(yàn)報(bào)告1）填寫課程名稱，實(shí)驗(yàn)日期。2）填寫學(xué)生所在的班級、學(xué)號、姓名3）實(shí)驗(yàn)報(bào)告部分為主體部分①根據(jù)網(wǎng)站規(guī)劃的內(nèi)容，給網(wǎng)站首頁設(shè)置欄目超級鏈接，并完成整個(gè)網(wǎng)站的建設(shè)；②網(wǎng)站中需要使用CSS樣式表為網(wǎng)站設(shè)置外觀；③網(wǎng)站中適當(dāng)使用Javascript體現(xiàn)網(wǎng)站的互動(dòng)以及動(dòng)態(tài)效果；④實(shí)現(xiàn)網(wǎng)站發(fā)布并確保能夠通過互聯(lián)網(wǎng)訪問，圖片與鏈接要求正確；⑤如果有相關(guān)實(shí)驗(yàn)體會可以通過實(shí)驗(yàn)報(bào)告的形式另行提交給實(shí)驗(yàn)教師。4）成績一欄和最后的指導(dǎo)教師評語為教師填寫。九、其它說明必要時(shí)對上述相關(guān)內(nèi)容進(jìn)行補(bǔ)充，或告知學(xué)生實(shí)驗(yàn)室管理的相關(guān)規(guī)定及安全事項(xiàng)等內(nèi)容。

實(shí)驗(yàn)五：ASP技術(shù)實(shí)現(xiàn)基本循環(huán)實(shí)驗(yàn)學(xué)時(shí)：2實(shí)驗(yàn)類型：（驗(yàn)證） 實(shí)驗(yàn)要求：（必修）一、實(shí)驗(yàn)?zāi)康慕Y(jié)合第三章電子商務(wù)邏輯層中對服務(wù)端應(yīng)用程序的技術(shù)理論講解，要求能夠掌握ASP、ASP.NET或者JAVA三種網(wǎng)絡(luò)編程技術(shù)的基本概念，在此基礎(chǔ)上掌握一種語言環(huán)境以及運(yùn)用方法，通過該語言從而完整體驗(yàn)系統(tǒng)設(shè)計(jì)開發(fā)實(shí)現(xiàn)的過程，實(shí)際也只能要求學(xué)生通過一門語言掌握在電子商務(wù)系統(tǒng)三個(gè)層次的開發(fā)特別，理解其核心的技術(shù)原理和背景，并以次來比照了解其他語言的技術(shù)特征，達(dá)到學(xué)習(xí)網(wǎng)絡(luò)開發(fā)技術(shù)的目的，另一方面也為實(shí)現(xiàn)電子商務(wù)系統(tǒng)的核心邏輯做技術(shù)上的準(zhǔn)備。本實(shí)驗(yàn)將以ASP作為基礎(chǔ)進(jìn)行講解，根據(jù)學(xué)生的對技術(shù)的掌握程度，有條件的將換成ASP.NET開發(fā)技術(shù)實(shí)現(xiàn)同一實(shí)驗(yàn)效果。二、實(shí)驗(yàn)內(nèi)容1、體驗(yàn)通過網(wǎng)頁服務(wù)器運(yùn)行網(wǎng)站實(shí)例實(shí)驗(yàn)教師演示將本機(jī)作為虛擬網(wǎng)站服務(wù)器，并通過HTTP形式訪問運(yùn)行服務(wù)端應(yīng)用程序的過程。2、調(diào)試ASP循環(huán)程序并得到預(yù)期效果按照實(shí)驗(yàn)內(nèi)容1的步驟調(diào)試ASP應(yīng)用程序，將執(zhí)行結(jié)果用“文件-另存為”的形式保存成HTM文件形式，并進(jìn)一步理解“ASP在服務(wù)端運(yùn)行，運(yùn)行結(jié)果以HTML主頁形式返回用戶瀏覽器，用戶在客戶端瀏覽器看到的僅僅是ASP頁的執(zhí)行結(jié)果所生成的HTML網(wǎng)頁，而ASP頁本身的內(nèi)容，用戶在客戶端瀏覽器是看不到的?！?）調(diào)試ASP應(yīng)用程序?qū)崿F(xiàn)基本循環(huán)（服務(wù)器端——ASP文件）2）采