Web開(kāi)發(fā)技術(shù)教師：孫倩E-mail：：1.課時(shí)安排上課時(shí)間1-14周，其中上課36學(xué)時(shí)，上機(jī)20學(xué)時(shí)。2.考試期末成績(jī)70%+平時(shí)成績(jī)30%〔考勤、實(shí)驗(yàn)報(bào)告〕。4.百度云盤賬號(hào)：

密碼：webdesign3.實(shí)驗(yàn)報(bào)告統(tǒng)一實(shí)驗(yàn)報(bào)告紙，每次實(shí)驗(yàn)結(jié)束，認(rèn)真書寫報(bào)告。占期末成績(jī)20%，其中大實(shí)驗(yàn)占10%。課程介紹1.Web根本知識(shí)2.Web站點(diǎn)規(guī)劃3.Web效勞器的配置4.Html5〔重點(diǎn)〕5.CSS3〔重點(diǎn)〕6.XML簡(jiǎn)介7.Javascript〔重點(diǎn)〕8.jQuery簡(jiǎn)介9.Json和Ajax教學(xué)目的通過(guò)本課程的學(xué)習(xí)，使學(xué)生掌握常用的Web開(kāi)發(fā)的根底知識(shí)、常用的技術(shù)與方法，能獨(dú)立開(kāi)發(fā)小型、中型的Web應(yīng)用系統(tǒng)，并了解最新的Web技術(shù)及其應(yīng)用。3第一章Web技術(shù)概述1.1根本概念1.2Web工作機(jī)制1.3Web開(kāi)發(fā)技術(shù)介紹一、什么是Web〔WWW〕?1.1根本概念二、Web三要素:統(tǒng)一資源定位（URL）：解決網(wǎng)上資源在何處的問(wèn)題。資源訪問(wèn)方式（HTTP）：解決用什么方法訪問(wèn)資源的問(wèn)題。超鏈接：提供在資源之間自由訪問(wèn)的手段。WWW是WorldWideWeb的縮寫，中文譯名“萬(wàn)維網(wǎng)”。Web是Internet提供的一種效勞，是基于Internet、采用Internet協(xié)議的一種體系結(jié)構(gòu)。1〕什么是URL〔UniversalResourceLocator〕?URL中文名為“統(tǒng)一資源定位器”。每一個(gè)站點(diǎn)及站點(diǎn)上的每個(gè)網(wǎng)頁(yè)都有一個(gè)唯一的地址，向?yàn)g覽器輸入U(xiǎn)RL，可以訪問(wèn)URL指出的Web網(wǎng)頁(yè)。URL的根本結(jié)構(gòu)為：通信協(xié)議://效勞器名稱[:通信端口號(hào)]/文件夾…/文件名例如：://163:2100/bbs/index.htm2〕HTTP是在Internet上傳送超文本的協(xié)議，它是運(yùn)行在TCP/IP集之上的應(yīng)用協(xié)議。簡(jiǎn)單地說(shuō)，HTTP就是專門為WWW設(shè)計(jì)的協(xié)議。HTTP協(xié)議特點(diǎn)：無(wú)狀態(tài)的第一次請(qǐng)求完成后，效勞器不會(huì)記住客戶的狀態(tài)。第二次請(qǐng)求時(shí)，效勞器需要重新讀取客戶的信息。基于請(qǐng)求和應(yīng)答的模式瀏覽器向效勞器發(fā)送請(qǐng)求，效勞器根據(jù)瀏覽器的請(qǐng)求作出不同的應(yīng)答。3〕超鏈接有了美妙的文字、精致的圖片和生動(dòng)的動(dòng)畫的網(wǎng)頁(yè)還不能稱之為網(wǎng)站，還要通過(guò)一種方式把這些獨(dú)立的網(wǎng)頁(yè)連接在一起，使之構(gòu)成一個(gè)統(tǒng)一的整體，而這種連接各個(gè)頁(yè)面的功能叫超鏈接。可以說(shuō)超鏈接是網(wǎng)站的脈絡(luò)。Web應(yīng)用(WebApplication)，也稱Web應(yīng)用系統(tǒng)。是利用各種動(dòng)態(tài)Web技術(shù)開(kāi)發(fā)的基于瀏覽器/效勞器〔Browser/Server，B/S)模式的事務(wù)處理系統(tǒng)。其事務(wù)邏輯處理和數(shù)據(jù)的邏輯運(yùn)算由Web效勞器、數(shù)據(jù)庫(kù)效勞器和客戶端共同提供，用戶借助瀏覽器在客戶端運(yùn)行，運(yùn)行結(jié)果通過(guò)瀏覽器返回給用戶。三、什么是Web應(yīng)用?常見(jiàn)的網(wǎng)絡(luò)計(jì)算器、留言板、聊天室和論壇BBS等，都是Web應(yīng)用程序，不過(guò)這些應(yīng)用相比照較簡(jiǎn)單，而Web應(yīng)用的真正核心和動(dòng)力應(yīng)該是對(duì)企業(yè)的業(yè)務(wù)進(jìn)行處理。Web網(wǎng)站是伴隨Internet技術(shù)而出現(xiàn)的一種由Web頁(yè)面組成的、用于圖文信息發(fā)布的網(wǎng)絡(luò)媒體。每個(gè)Web頁(yè)面是一個(gè)由各種文字、圖片等信息組成的頁(yè)面文檔(Document)它是作為靜態(tài)視圖存儲(chǔ)在效勞器中，并通過(guò)瀏覽器下載到客戶端顯示，這些頁(yè)面文檔通過(guò)鏈接(Links)形成一個(gè)Web網(wǎng)站。Web應(yīng)用是一種經(jīng)由Internet或Intranet、以Web方式訪問(wèn)的應(yīng)用程序，屬于軟件工程的范疇。它應(yīng)具有以下顯著的特點(diǎn)：它是作為單一實(shí)體、具有特定功能的計(jì)算機(jī)軟件應(yīng)用程序；它是通過(guò)網(wǎng)絡(luò)瀏覽器來(lái)運(yùn)行的，并通過(guò)效勞器處理數(shù)據(jù)以提供業(yè)務(wù)計(jì)算或信息效勞。四、Web網(wǎng)站與Web應(yīng)用共同點(diǎn)：基于B/S模式，都要求有好的可用性和用戶體驗(yàn)。都是由頁(yè)面(Page)組成的。區(qū)別：對(duì)于一個(gè)網(wǎng)站，用戶關(guān)注的是它的內(nèi)容、查詢的效率和界面的效果。而對(duì)于一個(gè)Web應(yīng)用，用戶更關(guān)心的是它的功能，也就是它所能提供的效勞，并對(duì)其交互性有更高的要求。四、Web網(wǎng)站與Web應(yīng)用〔續(xù)〕五、其他常見(jiàn)概念1〕網(wǎng)站〔WebSite〕又稱Web站點(diǎn)，是Internet中提供信息效勞的機(jī)構(gòu)，可以提供WWW、FTP等效勞。2〕Web頁(yè)〔Webpage〕Web頁(yè)是指Web效勞器上的一個(gè)個(gè)超文本文件。Web頁(yè)中往往包含指向其他Web頁(yè)面的超級(jí)鏈接。3〕主頁(yè)〔Homepage〕用戶在Web效勞器上看到的第一個(gè)Web頁(yè)，該Web頁(yè)一般的名稱為default.htm或index.htm。首頁(yè)中往往列出了網(wǎng)站的信息目錄，或指向其他站點(diǎn)的超鏈接。4〕Web效勞器將本地的信息用超文本組織，為用戶在Internet上搜索和瀏覽信息提供效勞。一、C/S模式與B/S模式1.2Web工作機(jī)制

1.C/S模式(Client/Server)C/S計(jì)算模式將應(yīng)用一分為二：前端是客戶機(jī)，幾乎所有的應(yīng)用邏輯都在客戶端進(jìn)行和表達(dá)，客戶機(jī)完成與用戶的交互任務(wù)。后端是效勞器，它負(fù)責(zé)后臺(tái)數(shù)據(jù)的查詢和管理、大規(guī)模的計(jì)算等效勞。通常客戶端的任務(wù)比較繁重，稱作“肥”客戶端，而效勞器端的任務(wù)較輕，稱作“瘦”效勞器。C/S模式的結(jié)構(gòu)如下圖：C/S計(jì)算模式具有以下幾個(gè)方面的優(yōu)點(diǎn)：通過(guò)異種平臺(tái)集成，能夠協(xié)調(diào)現(xiàn)有的各種根底結(jié)構(gòu)：分布式管理；能充分發(fā)揮客戶端PC的處理能力，平安、穩(wěn)定、速度快，且在適當(dāng)情況下可脫機(jī)操作。2.B/S模式B/S模式是一種基于Web的協(xié)同計(jì)算模式，是一種三層架構(gòu)的瘦客戶機(jī)/肥效勞器的計(jì)算模式。第一層為客戶端表示層，客戶層只保存一個(gè)Web瀏覽器，不存放任何應(yīng)用程序，其運(yùn)行代碼可以從位于第二層Web效勞器下載到本地的瀏覽器中執(zhí)行，幾乎不需要任何管理工作。第二層是應(yīng)用效勞器層，由一臺(tái)或多臺(tái)效勞器〔Web效勞器也位于這一層〕組成，處理應(yīng)用中的所有業(yè)務(wù)邏輯，包括對(duì)數(shù)據(jù)庫(kù)的訪問(wèn)等工作，該層具有良好的可擴(kuò)充性，可以隨著應(yīng)用的需要任意增加效勞的數(shù)目。第三層是數(shù)據(jù)中心層，主要由數(shù)據(jù)庫(kù)系統(tǒng)組成。B/S模式的結(jié)構(gòu)如下圖:B/S模式與傳統(tǒng)的C/S模式相比表達(dá)了集中式計(jì)算的優(yōu)越性：具有良好的開(kāi)放性，利用單一的訪問(wèn)點(diǎn)，用戶可以在任何地點(diǎn)使用系統(tǒng)；用戶可以跨平臺(tái)以相同的瀏覽器界面訪問(wèn)系統(tǒng)；因?yàn)樵诳蛻舳酥恍枰惭b瀏覽器，取消了客戶端的維護(hù)工作，有效地降低了整個(gè)系統(tǒng)的運(yùn)行和維護(hù)本錢。1.獲取靜態(tài)網(wǎng)頁(yè)過(guò)程二、瀏覽器與Web效勞器的工作原理2.獲取動(dòng)態(tài)網(wǎng)頁(yè)過(guò)程①客戶端動(dòng)態(tài)網(wǎng)頁(yè)JavaScript+DOM+CSS實(shí)現(xiàn)動(dòng)態(tài)網(wǎng)頁(yè)微軟的ActiveX技術(shù)Sun的JavaApplet技術(shù)MicroMediaFlash技術(shù)②效勞器端動(dòng)態(tài)頁(yè)面簡(jiǎn)單的講是效勞器需要執(zhí)行相關(guān)代碼才能返回的頁(yè)面。動(dòng)態(tài)內(nèi)容能夠?yàn)閱蝹€(gè)用戶的每次訪問(wèn)量身定制的內(nèi)容。動(dòng)態(tài)網(wǎng)頁(yè)允許雙向的交流。三、Web的工作過(guò)程1.3Web開(kāi)發(fā)技術(shù)介紹Web開(kāi)發(fā)平臺(tái)客戶端技術(shù)效勞端技術(shù)一、Web開(kāi)發(fā)平臺(tái).NET開(kāi)發(fā)平臺(tái)2000年6月，微軟公司宣布其.NET戰(zhàn)略。2001年，ECMA通過(guò)了Microsoft提交的C#語(yǔ)言和CLI標(biāo)準(zhǔn)，這兩個(gè)技術(shù)標(biāo)準(zhǔn)構(gòu)成了.NET平臺(tái)的基石。2002年，Microsoft正式發(fā)布.NETFramework和VisualStudio.NET開(kāi)發(fā)工具。微軟公司的.NET戰(zhàn)略揭示了一個(gè)全新的境界，提供了一個(gè)新的軟件開(kāi)發(fā)模型。.NET戰(zhàn)略的一個(gè)關(guān)鍵特性在于它獨(dú)立于任何特定的語(yǔ)言或平臺(tái)。它不要求程序員使用一種特定的程序語(yǔ)言。相反，開(kāi)發(fā)者可使用多種.NET兼容語(yǔ)言的任意組合來(lái)創(chuàng)立一個(gè).NET應(yīng)用程序。多個(gè)程序員可致力于同一個(gè)軟件工程，但分別采用自己最精通的.NET語(yǔ)言編寫代碼。JavaJava是SunMicrosystems公司于1995年5月推出的程序設(shè)計(jì)語(yǔ)言(Java語(yǔ)言)和Java平臺(tái)的總稱。它最初的名字是Oak，被設(shè)計(jì)用來(lái)在嵌入式系統(tǒng)中運(yùn)行，后來(lái)被用做了基于Web的技術(shù)。Java平臺(tái)由Java虛擬機(jī)和Java應(yīng)用編程接口(JavaAPI)構(gòu)成。JavaAPI為Java應(yīng)用提供了一個(gè)獨(dú)立于操作系統(tǒng)的標(biāo)準(zhǔn)接口，使得Java具備了平臺(tái)無(wú)關(guān)性。跨平臺(tái)、動(dòng)態(tài)的Web、Internet計(jì)算是Java的主要特征，它經(jīng)常被Web效勞器使用以發(fā)布復(fù)雜的交互式應(yīng)用。IBM的WebSphere、BEA的WebLogic都是這一領(lǐng)域里最為成功的商業(yè)軟件平臺(tái)。二、Web客戶端開(kāi)發(fā)技術(shù)①HTML〔HypertextMarkupLanguage，超文本標(biāo)記語(yǔ)言〕HTML是最根本的網(wǎng)頁(yè)設(shè)計(jì)語(yǔ)言，它是一種文本形式的標(biāo)記符號(hào)語(yǔ)言，可以使用任何文字處理軟件編輯處理。HTML文檔的擴(kuò)展名通常是html或htm。②CSS〔CascadingStyleSheet，層疊樣式表〕負(fù)責(zé)控制頁(yè)面的外觀表現(xiàn)，如布局、顏色和字體等。CSS提供了網(wǎng)頁(yè)頁(yè)面結(jié)構(gòu)內(nèi)容與表現(xiàn)形式的別離機(jī)制，大大簡(jiǎn)化了HTML頁(yè)面的管理與維護(hù)工作，也提高了其開(kāi)發(fā)的工作效率。CSS可用于控制任何HTML和XML內(nèi)容的表現(xiàn)形式。③腳本腳本〔Script〕是一種介于HTML與編程語(yǔ)言之間的特殊語(yǔ)言，可以使Web頁(yè)面具有動(dòng)態(tài)效果和交互功能。比較流行的腳本語(yǔ)言有兩種：VBScript和JavaScript。JavaScript是由Netscape公司開(kāi)發(fā)的一種腳本語(yǔ)言，借助JavaScript等腳本語(yǔ)言，可以在Web頁(yè)面實(shí)現(xiàn)客戶端與效勞器的動(dòng)態(tài)交互。JavaScript短小精悍，又是在客戶機(jī)上執(zhí)行，大大提高了網(wǎng)頁(yè)的瀏覽速度和交互能力。它是專門為制作Web頁(yè)面而量身定做的一種簡(jiǎn)單的編程語(yǔ)言，如今JavaScript越來(lái)越廣泛地使用于Web開(kāi)發(fā)上。Jquery是輔助JavaScript開(kāi)發(fā)的庫(kù)。④XML〔ExtensibleMarkupLanguage，可擴(kuò)展的標(biāo)記語(yǔ)言〕是一套定義語(yǔ)義標(biāo)記的規(guī)那么，描述的是數(shù)據(jù)的實(shí)際內(nèi)容，不描述數(shù)據(jù)顯示方式。應(yīng)用XML制作頁(yè)面的根本思想是：將內(nèi)容與內(nèi)容的顯示方式分別定義，以使內(nèi)容組織人員將精力集中于內(nèi)容本身。⑤XHTML〔TheExtensibleHyperTextMarkupLanguage，可擴(kuò)展超文本標(biāo)記語(yǔ)言〕實(shí)際上是HTML向XML過(guò)渡過(guò)程中產(chǎn)生的一種標(biāo)簽語(yǔ)言。結(jié)合了HTML和XML的優(yōu)點(diǎn)，由于它和HTML很相似，所以可以很容易把以前的HTML進(jìn)行簡(jiǎn)化和改裝，形成新的XHTML文檔，這要比直接重新構(gòu)建XML文檔簡(jiǎn)單的多。⑥Ajax當(dāng)前和未來(lái)的Web開(kāi)發(fā)不得不提到近幾年最流行的一個(gè)詞語(yǔ)Ajax。Ajax是當(dāng)前非常流行的Web開(kāi)發(fā)技術(shù)。Ajax并不是什么新的技術(shù)，只不過(guò)是JavaScript中一些相比照較高級(jí)的特性的綜合應(yīng)用。一般來(lái)說(shuō)，Ajax所涉及的Javascript特性主要包括：通過(guò)JavaScript的XMLHttpRequest對(duì)象實(shí)現(xiàn)異步請(qǐng)求與調(diào)用。通過(guò)JavaScript對(duì)XML進(jìn)行解析和處理。通過(guò)JavaScript操作DOM來(lái)實(shí)現(xiàn)客戶端的動(dòng)態(tài)顯示。⑦JSON〔JavaScriptObjectNotation〕是一種輕量級(jí)的數(shù)據(jù)交換語(yǔ)言，以文字為根底，且易于讓人閱讀。主要用于跟效勞器進(jìn)行交換數(shù)據(jù)。跟XML相類似，它獨(dú)立語(yǔ)言，在跨平臺(tái)數(shù)據(jù)傳輸上有很大的優(yōu)勢(shì)。盡管JSON是在Javascript的一個(gè)子集，但JSON是獨(dú)立于語(yǔ)言的文本格式，并且采用了類似于C語(yǔ)言家族的一些習(xí)慣。三、Web效勞器端開(kāi)發(fā)技術(shù)1.CGI技術(shù)2.JSP(JavaServerPages)技術(shù)3.ASP(ActiveServerPages)與ASP.NET技術(shù)4.PHP(PersonalHomepageTools)技術(shù)1.CGI技術(shù)CGI〔CommonGatewayInterface，公共網(wǎng)關(guān)接口〕是Web開(kāi)發(fā)應(yīng)用中使用最早的一種技術(shù)。是在WebServer端運(yùn)行的一個(gè)可執(zhí)行程序。CGI就是為了擴(kuò)展頁(yè)面的功能而設(shè)立的，CGI是動(dòng)態(tài)Web頁(yè)面的根底，也是Web與其他應(yīng)用交互的根底。缺點(diǎn)：編寫方式困難，效率低下。2.ISAPIISAPI〔Internet效勞器應(yīng)用程序編程接口〕微軟公司為編程人員提供的另一種動(dòng)態(tài)web頁(yè)面開(kāi)發(fā)方法。其功能依賴于DLL而不是可執(zhí)行程序。ISAPI擴(kuò)展對(duì)象在效勞器的生命周期內(nèi)通常只裝載一次，而且ISAPI程序通常運(yùn)行在IIS的進(jìn)程空間，這樣ISAPI擴(kuò)展對(duì)象可以更好的與IIS交互，這種運(yùn)行模式將提高效勞器的性能。缺點(diǎn)：編寫ISAPI程序?qū)帉懻叩囊蠓浅８撸茈y掌握編寫方法。3.ASP技術(shù)ASP〔ActiveServerPages〕技術(shù)是Microsoft公司在1996年底推出