商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁

1、第第2章章 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁設(shè)計(jì)技術(shù)商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁設(shè)計(jì)技術(shù)2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.1 商務(wù)表達(dá)層的功能實(shí)現(xiàn)商務(wù)表達(dá)層的功能實(shí)現(xiàn)n商務(wù)表達(dá)層n客戶端：表現(xiàn)數(shù)據(jù)客戶端：表現(xiàn)數(shù)據(jù)n特點(diǎn)：界面友好，具有通用性、易用性、靈活性特點(diǎn)：界面友好，具有通用性、易用性、靈活性nWeb服務(wù)器：發(fā)布信息，與客戶端和應(yīng)用服務(wù)端進(jìn)行交互服務(wù)器：發(fā)布信息，與客戶端和應(yīng)用服務(wù)端進(jìn)行交互n商務(wù)表達(dá)層的實(shí)現(xiàn)方式計(jì)算機(jī)、便攜設(shè)備 無線移動設(shè)備、 信息家電HTML/XML/DHTML WML/XMLWeb服務(wù)器Web服務(wù)器應(yīng)用服務(wù)器Web服務(wù)器表達(dá)層工具支持平臺表達(dá)層工具2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商

2、務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.1 商務(wù)表達(dá)層的功能實(shí)現(xiàn)商務(wù)表達(dá)層的功能實(shí)現(xiàn)n硬件設(shè)備硬件設(shè)備n瘦客戶端、胖客戶端瘦客戶端、胖客戶端n胖客戶端：基于傳統(tǒng)的客戶端應(yīng)用程序；胖客戶端：基于傳統(tǒng)的客戶端應(yīng)用程序；n瘦客戶端：基于瀏覽器。瘦客戶端：基于瀏覽器。n靜態(tài)內(nèi)容和動態(tài)內(nèi)容靜態(tài)內(nèi)容和動態(tài)內(nèi)容n靜態(tài)內(nèi)容：客戶端上顯示的內(nèi)容，預(yù)先放置在靜態(tài)內(nèi)容：客戶端上顯示的內(nèi)容，預(yù)先放置在Web服務(wù)器上；服務(wù)器上；n動態(tài)內(nèi)容：客戶端上顯示的內(nèi)容，預(yù)先服務(wù)器上沒有，是在客戶請求發(fā)動態(tài)內(nèi)容：客戶端上顯示的內(nèi)容，預(yù)先服務(wù)器上沒有，是在客戶請求發(fā)出后，根據(jù)請求內(nèi)容和后臺數(shù)據(jù)庫中的數(shù)據(jù)，通過調(diào)用執(zhí)行一個文件（出后，根據(jù)請求內(nèi)容和后臺

3、數(shù)據(jù)庫中的數(shù)據(jù)，通過調(diào)用執(zhí)行一個文件（通常為動態(tài)腳本）動態(tài)產(chǎn)生的。通常為動態(tài)腳本）動態(tài)產(chǎn)生的。2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.2 Web系統(tǒng)與HTTP協(xié)議n2.2.1 Web系統(tǒng)n原理：商業(yè)數(shù)據(jù)被組織到一個超文本文件中，借助Http協(xié)議，通過網(wǎng)絡(luò)來傳送Web瀏覽器Web瀏覽器Web瀏覽器TCP/IPHTTPWeb服務(wù)器CGI、Script程序數(shù)據(jù)庫2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.2 Web系統(tǒng)與HTTP協(xié)議n2.2.1 Web系統(tǒng)nWeb五大要素五大要素nURLn幾種形式幾種形式n域名域名+目錄名目錄名+文件名文件名n域名域名+目錄名目錄名n域名域名n含有程序的

4、網(wǎng)址含有程序的網(wǎng)址n超文本置標(biāo)語言（超文本置標(biāo)語言（HTML）nWeb服務(wù)器服務(wù)器nWeb瀏覽器瀏覽器n超文本傳輸協(xié)議（超文本傳輸協(xié)議（HTTP）2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.2 Web系統(tǒng)與HTTP協(xié)議n2.2.2 HTTP協(xié)議n一個實(shí)例：測試一個實(shí)例：測試HTTP協(xié)議協(xié)議2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.2 Web系統(tǒng)與HTTP協(xié)議n2.2.2 HTTP協(xié)議n一個實(shí)例：測試一個實(shí)例：測試HTTP協(xié)議（程序代碼）協(xié)議（程序代碼）Dim str1 As StringPrivate Sub Close_Click() Winsock1.CloseEnd SubPr

5、ivate Sub connect_Click() Winsock1.RemoteHost = “ Winsock1.RemotePort = 80 Winsock1.Protocol = sckTCPProtocol Winsock1.connectEnd Sub2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁P(yáng)rivate Sub get_Click() If Winsock1.State 7 Then State=0表示winsock處于Close狀態(tài) State=1表示winsock處于Open狀態(tài) State=2表示winsock處于Listening狀態(tài) State=7表示winsoc

6、k處于Connected狀態(tài) State=9表示winsock處于Error狀態(tài) MsgBox 還未與Web Server連接號，請等待或重新連接. Exit Sub Else Winsock1.SendData GET /index.html HTTP/1.1 + Chr(13) + Chr(10) + Host: + vbCrLf + vbCrLf 發(fā)送HTTP的GET命令 End IfEnd Sub2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁 Private Sub head_Click() Winsock1.SendData HEAD /index.html HTTP/1.1 + vb

7、CrLf + Host: + vbCrLf + vbCrLfEnd Sub Private Sub post_Click() Winsock1.SendData POST /index.html HTTP/1.1 + vbCrLf + Host: + vbCrLf + Content-Type:text/plain + vbCrLf + Content-Length:7 + vbCrLf + vbCrLf+brand=A + vbCrLf + vbCrLfEnd Sub Private Sub Winsock1_DataArrival(ByVal bytesTotal As Long) Win

8、sock1.GetData str1 Text1.Text = str1End Sub Private Sub Winsock1_Error(ByVal Number As Integer, Description As String, ByVal Scode As Long, ByVal Source As String, ByVal HelpFile As String, ByVal HelpContext As Long, CancelDisplay As Boolean) MsgBox Winsock出錯!End Sub 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n2.2.2 HTT

9、P協(xié)議n象DCOM和IIOP一樣，HTTP層通過TCP/IP進(jìn)行請求/響應(yīng)通信。一個HTTP的客戶端用TCP連接到Web服務(wù)器。在HTTP中使用的標(biāo)準(zhǔn)端口號是80，但任何其它端口也能被使用。在建立TCP連接后，客戶端可以發(fā)送一個請求消息到服務(wù)器端。服務(wù)器在處理請求后發(fā)回一個HTTP響應(yīng)消息到客戶端。請求和響應(yīng)消息都可以包含任意的傳輸體的信息，通常用Content-Length和Content-Type的 HTTP 頭來標(biāo)記(詳細(xì)見RFC1616)。n一個合法的HTTP POST請求消息示例：nPOST /index.html HTTP/1.1nHost:nContent-Ty

10、pe:text/plainnContent-Length:7nbrand=An n一個合法的HTTP GET請求消息示例：nGET /index.html HTTP/1.1nHost:n 2.2 Web系統(tǒng)與HTTP協(xié)議2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n2.2.2 HTTP協(xié)議nHTTP響應(yīng)n在處理了請求之后，在處理了請求之后，Web服務(wù)器將發(fā)回一個服務(wù)器將發(fā)回一個HTTP響應(yīng)到客戶端。響應(yīng)中包括一個狀態(tài)代碼，表示請求響應(yīng)到客戶端。響應(yīng)中包括一個狀態(tài)代碼，表示請求的結(jié)果。的結(jié)果。n返回狀態(tài)代碼200，表示HTTP命令已被Web服務(wù)器成功解析；n返回狀態(tài)代碼400，

11、表示W(wǎng)eb服務(wù)器解析HTTP命令失敗；n返回狀態(tài)代碼30X，表示W(wǎng)eb服務(wù)器已將HTTP請求轉(zhuǎn)向到另一Web服務(wù)器；n返回狀態(tài)代碼50X，表示W(wǎng)eb服務(wù)器不支持此HTTP請求命令；n狀態(tài)代碼1XX，為Web服務(wù)器保留碼n示例：2.2 Web系統(tǒng)與HTTP協(xié)議400 Bad RequestContent-Length: 0200 OKContent-Type: text/plainContent-Length: 12dlroW ,olleH 307 Temporarily MovedLocation: 4/foobarContent-Length: 02 商

12、務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n請將測試HTTP命令的VB程序改寫成java程序。2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n靜態(tài)網(wǎng)頁的特征 n靜態(tài)網(wǎng)頁的內(nèi)容固定不變;n靜態(tài)網(wǎng)頁的制作比較方便； n靜態(tài)網(wǎng)頁的體系結(jié)構(gòu) Client(瀏覽器)Web Server硬盤HTML頁面從硬盤獲取文件文件返回頁面請求2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n標(biāo)準(zhǔn)通用置標(biāo)語言SGML (Standard Generalized Markup Language) n置標(biāo)n標(biāo)志語言 nSGML SGML(Standard Genera

13、lized Markup Language)是最早的標(biāo)記語言，而且是一種豐富的元語言，幾乎可以用來定義無數(shù)種標(biāo)記語言，HTML和XML都是在此基礎(chǔ)上派生出來的。SGML是ISO組織在1986年推出的一個用來創(chuàng)建標(biāo)記語言的元語言標(biāo)準(zhǔn)，它源自IBM在1969年開發(fā)的GML。正如其名所言，SGML是一種用標(biāo)記描述文檔資料的通用語言，包含了一系列的文檔類型定義（DTD,Document Type Definition），DTD中定義了標(biāo)記的含義，因而SGML是可以擴(kuò)充的。SGML為出版業(yè)提供了一種將數(shù)據(jù)內(nèi)容與顯示分離開來的數(shù)據(jù)表示方法，使得數(shù)據(jù)獨(dú)立于機(jī)器平臺和處理程序，在許多大型出版系統(tǒng)中發(fā)揮了重要作

14、用2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n超文本置標(biāo)語言HTML n特點(diǎn)n平臺兼容 n文本文件n超鏈接 nWeb服務(wù)器不處理標(biāo)記，由客戶端瀏覽器解釋 n豐富的多媒體顯示、各種布局處理n缺點(diǎn)nHTML更多的關(guān)注Web瀏覽器如何在頁面上安排文本、圖象和按扭等，過多的考慮外觀使，缺乏對結(jié)構(gòu)化數(shù)據(jù)的表示能力；nHTML還有一些諸如鏈路丟失后不能自動糾正、下載的內(nèi)容太多、搜索不方便、時間長等缺點(diǎn)；nHTML中有限的標(biāo)記不能滿足眾多Web應(yīng)用的需要 ，缺乏可擴(kuò)展性2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n超文本標(biāo)記語言HTML實(shí)例

15、（略）n樣式n樣式種類：HTML樣式、內(nèi)嵌的CSS樣式、外接的CSS樣式 n實(shí)例2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁 無標(biāo)題文檔 浮雕彩色文字 浮雕彩色文字 浮雕彩色文字 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML n前言 XML在SGML的基礎(chǔ)上，去除SGML中過于復(fù)雜的東西（缺點(diǎn)），保留一些作為元標(biāo)記語言的東西（優(yōu)點(diǎn)），用戶可以自己定義標(biāo)記，自己定義的標(biāo)記可以在DTD或Scheme（模式）中加以描述，并且，與SGML一定需要DTD不同，在XML中DTD可有可無，它的使用完全視使用者需要而定。用戶甚至可以通過XML制定自己的標(biāo)記

16、語言，而不必得到W3C、Microsoft、Netscape的同意，因此XML的應(yīng)用潛力是很明顯的。2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁GML(1969)SGML(1985)XML(1998)XHTMLMathMLWMLSVGcXML(1969)ebXML(1969)HTML(1993)2.3 靜態(tài)頁面的表達(dá)及其技術(shù)XML家族2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 nXML聲明n元素與屬性n注釋n處理

17、指令 nCDATA區(qū) 網(wǎng)頁設(shè)計(jì) 王大名 590 電子商務(wù)技術(shù)基礎(chǔ) 李立洪 120 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 nXML聲明n元素與屬性n注釋n處理指令 nCDATA區(qū) n說明：nCDATA區(qū)以“!CDATA”為起始，“”為終了。區(qū)塊內(nèi)容中唯一不能包含的正是“”這個終止符號。其他內(nèi)容，只要是合格Unicode字，都可以自由放置其中；nXML中要區(qū)分大小寫，因此“!CDATA” 不可寫成 “!cdata” 或 “!Cdata” ；n出現(xiàn)在CDATA區(qū)中的內(nèi)容，解析器在解析時原封不動、一五一十地交給下游的程序；比較

18、：2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 n編寫XML的幾個原則 n所有的元素都要配對n標(biāo)記之間不得交叉 n所有屬性值都得含有引號 n大小寫有區(qū)別 n一空二空有區(qū)別 在HTML里，存在這類自成一個單元的標(biāo)記，這在XML中稱為空元素（empty element),因?yàn)檫@樣的元素不含任何文字內(nèi)容，只有屬性。XML為空元素特別發(fā)明了一種新的表示法，如下： 若帶有屬性的話，則寫成： 若： 電子商務(wù)技術(shù)基礎(chǔ) 無名氏 這就犯了”標(biāo)記之間不得相交“的大忌，會被刪除掉。XML中規(guī)定，所有的元素排列必須是嚴(yán)謹(jǐn)?shù)臉錉罱Y(jié)構(gòu)。在使用DOM、XS

19、LT和XPointer來分別控制、轉(zhuǎn)換、連接XML文件時，都需要隨時對文件的內(nèi)部結(jié)構(gòu)了若指掌。 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 n名稱空間（namespace）n名稱空間的規(guī)定，并沒有收錄在XML1.0的標(biāo)準(zhǔn)中，而是透過后來一份單獨(dú)的標(biāo)準(zhǔn)來增補(bǔ)，這份標(biāo)準(zhǔn)的全名為“Namespaces in XML”；n xml1.0的標(biāo)準(zhǔn)：/tr/rec-xml; Namespaces in XML: /tr/rec-xml-names )2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商

20、務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)n區(qū)分各個標(biāo)記，避免與其它標(biāo)記混淆 張3 無法區(qū)別這兩個不同的標(biāo)記2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) 新祥發(fā)新祥發(fā) . . . . . . . 同仁堂同仁堂 . . . . . . . 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) 平時所說的網(wǎng)址，就是URL。其實(shí)名稱空間中的標(biāo)記規(guī)定的是使用URI，URI全名為Uniform Resource Identifier(統(tǒng)一資源標(biāo)記碼)，這是一個Internet 標(biāo)準(zhǔn)，記載于RFC2396;它與URL有何不同呢？基本上，URI比較廣

21、義，泛指所有以字符串標(biāo)示的網(wǎng)絡(luò)資源，范圍涵蓋了URL和URN。URL指的是標(biāo)有通信協(xié)定（如HTTP、FTP、GOPHER）的字符串。URN(Uniform Resource Name)則是用來標(biāo)示持久、而且有專門機(jī)構(gòu)負(fù)責(zé)的資源，譬如圖書館的圖書總目。 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) 新祥發(fā)新祥發(fā) . . . . . . . 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) 連到兩只老虎 這樣也可以連到 2T2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 nXM

22、L數(shù)據(jù)類型定義 n問題的提出2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) 電子商務(wù)技術(shù)基礎(chǔ) 李立洪，李衛(wèi) 120 90 電子商務(wù)技術(shù)基礎(chǔ) 李立洪 李衛(wèi) 120 90 這里究竟如何表示數(shù)據(jù)？需要定義一套法則來規(guī)范它。這套法則叫DTD（Document Type Definition)，也就是對XML文件在格式上進(jìn)行限定。 用DTD可以清楚的定義和規(guī)范：”作者“這個元素到底是可以出現(xiàn)多次，還是在任何一個”書籍“.中只能出現(xiàn)一次？一個元素能包含哪些屬性？父子元素相互依存的關(guān)系？各個元素出現(xiàn)的順序？ 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技

23、術(shù) 網(wǎng)頁設(shè)計(jì) 張凡 590 電子商務(wù)技術(shù)基礎(chǔ) 李立洪 120 Book.dtd文件的內(nèi)容如下：2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 nXML數(shù)據(jù)類型定義nXML數(shù)據(jù)的表現(xiàn)與樣式鏈接n 利用XML語言和DTD文檔，可以將數(shù)據(jù)、文件資料準(zhǔn)確完整的表示表示出來，但缺少顯示格式信息（內(nèi)容與顯示分離），XML文檔還不能像用戶所希望的那樣在IE中表現(xiàn)表現(xiàn)出來。因此除了XML文檔之外，還需要有相關(guān)的文件提供有關(guān)顯示和處理XML文檔的信息，這種文件就是樣式文件(.css,.XSL) 或:?xml-stylesheet href=sty

24、le.xsl type=text/xsl ?2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)n 擴(kuò)展標(biāo)記語言XML nXML語法 nXML數(shù)據(jù)類型定義nXML數(shù)據(jù)的表現(xiàn)與樣式鏈接nXSL樣式文件XSL是一種用來轉(zhuǎn)換XML文檔結(jié)構(gòu)的語言，XSL文檔中定義了與XML文檔中各個邏輯成分相匹配的模板及匹配轉(zhuǎn)化方式，解析器裾此可將XML源文件轉(zhuǎn)換為帶樣式信息的可瀏覽文檔，如HTML格式、FO格式、或者其它面向顯示方式的XML文檔，限于目前瀏覽器的支持能力，大多數(shù)的情況下轉(zhuǎn)化為一個HTML文件進(jìn)行顯示。至于具體的轉(zhuǎn)換過程，可以在服務(wù)器端進(jìn)行，也可以在客戶端進(jìn)行，分別對應(yīng)著不同的轉(zhuǎn)

25、換模式。在IE5.5中內(nèi)嵌了一個MSXML3解析器，由它生成的帶格式的中間文件會顯示在瀏覽器中。 張三 男 20 李四 女 27 個人檔案 姓名 性別 年齡 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 擴(kuò)展標(biāo)記語言XML nXML語法 nXML數(shù)據(jù)類型定義nXML數(shù)據(jù)的表現(xiàn)與樣式鏈接 nXML應(yīng)用開發(fā) n構(gòu)造XML標(biāo)記語言 n生成XML文檔n顯示XML文檔 n操縱XML文檔 操縱XML文檔可以通過使用DOM或SAX(Simple API for XML)應(yīng)用編程接口來實(shí)現(xiàn)。DOM是W3C為XML文檔和HTML文檔定制的一個獨(dú)立于平臺和語言的編程接口標(biāo)準(zhǔn)，使得

26、程序和腳本都能以標(biāo)準(zhǔn)的方式存取與更新文檔的內(nèi)容、結(jié)構(gòu)和式樣。要查找完整的XML文檔對象模型，請?jiān)L問微軟網(wǎng)站。同時，如何你想了解XML DOM以及XSL和ASP的高級用法的例子，請?jiān)L問 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) n 置標(biāo)語言XML n XHTML nHTML4.0之后為XHTML；n 什么是XHTMLnXHTML最早叫“HTML in XML“。簡單的講，就是把過去以SGML定義的HTML，改用XML來重新定義，所有XHTML的標(biāo)記都以既有的HTML4.0標(biāo)記來定義，各元素和屬性的名稱和用法幾乎完全不變。不過因?yàn)樽兂闪薠ML,有些地方必須遵照XHTM

27、L的規(guī)矩，嚴(yán)格執(zhí)行，不能再象以前那樣隨便。XHTML1.0這套標(biāo)準(zhǔn)，1998年8月24日升格為建議標(biāo)準(zhǔn)（proposed recommendation） 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁 幾只老虎才夠看？!CDATA function countTigers(n) if (n 一個非常短的段落。 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù) nWeb服務(wù)器的安裝與設(shè)置 n網(wǎng)頁制作與實(shí)例 n將網(wǎng)頁發(fā)布到服務(wù)器 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)nApache是開放源代碼的Web服務(wù)器軟件，是最常用的Web服務(wù)器。A

28、pache常用在Unix和Linux系統(tǒng)下，也有用于Windows平臺下的版本n下載Apache：/mirror/httpd/binaries/win32/ ，版本：1.3.x和2.0.x ，擴(kuò)展名：exe或msi n安裝Apache：在“Network Domain”里輸入域,若服務(wù)器的域名為“”，則在這里輸入“”；在“Server Name”里輸入服務(wù)器名，即完整的服務(wù)器域名，這里為“”；在“Administrators Email Address”里輸入網(wǎng)站管理員的Email地址 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2 商務(wù)表達(dá)層與靜

29、態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n4 4）配置）配置ApacheApache 表2-10 Apache的配置文件httpd.conf中的主要選項(xiàng)選項(xiàng)選項(xiàng)說明說明Port 80Apache的端口，默認(rèn)值是的端口，默認(rèn)值是80。ServerName Web服務(wù)器的名字服務(wù)器的名字,安裝時輸入的安裝時輸入的“Server Name”就是保存在這里。就是保存在這里。DocumentRoot C:/Program Files/Apache Group/Apache/htdocs網(wǎng) 站 的 根 目 錄 。 如 果 想 把 網(wǎng) 站 文 件 存 放 在網(wǎng) 站 的 根 目 錄 。 如 果 想 把 網(wǎng) 站 文 件 存

30、放 在“D:myweb”目錄下，可以把目錄下，可以把DocumentRoot后面后面的目錄修改為的目錄修改為“D:/myweb”。Options Indexes FollowSymLinks MultiViews為了安全，有時需要刪除為了安全，有時需要刪除Indexes屬性，否則別人屬性，否則別人可以瀏覽到網(wǎng)站里的所有文件?？梢詾g覽到網(wǎng)站里的所有文件。DirectoryIndex index.html默認(rèn)首頁文件名。當(dāng)在瀏覽器里輸入一個地址默認(rèn)首頁文件名。當(dāng)在瀏覽器里輸入一個地址（例如（例如http:/ /cgi-bin/ C:/Program Files/Apache Group/Apach

31、e/cgi-bin/CGI文件存放路徑。文件存放路徑。2.3 靜態(tài)頁面的表達(dá)及其技術(shù)2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n設(shè)置虛擬目錄： 在主配置文件中找到行：，在這行的下面添加如下內(nèi)容：Alias /vdir/ c:/comexe/ Options MultiViewsAllowOverride NoneOrder allow,denyAllow from all這樣，通過訪問 http:/ 2.3 靜態(tài)頁面的表達(dá)及其技術(shù)2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁n網(wǎng)頁設(shè)計(jì)環(huán)境n在進(jìn)行網(wǎng)頁制作之前,需要了解相關(guān)的技術(shù)和外在的條件,估計(jì)網(wǎng)頁文件的大小、復(fù)雜程度、下載時間和訪問者的感受

32、，同時也需要設(shè)計(jì)很好的導(dǎo)航結(jié)構(gòu)，這樣才能讓人不“迷路”。n網(wǎng)頁設(shè)計(jì)應(yīng)盡可能從用戶出發(fā)，根據(jù)不同的對象，采用不同的技術(shù) ，考慮用戶的具體環(huán)境進(jìn)行網(wǎng)頁設(shè)計(jì)，使之適應(yīng)不同的瀏覽器、操作系統(tǒng)和計(jì)算機(jī)平臺，最大限度的吸引用戶。 2.3 靜態(tài)頁面的表達(dá)及其技術(shù)2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)n網(wǎng)頁的制作工具 n簡單的文檔編輯工具n主要應(yīng)用于HTML等純文本文件的編輯；如Windows下的記事本，DOS下的Editor編輯器等；n功能齊全的專用工具n可以以圖形化的界面完成所見所得的靜態(tài)網(wǎng)頁，包括基本的網(wǎng)頁文本、網(wǎng)頁外觀、超級鏈接及豐富的多媒體和動畫處理工具，此外這些

33、工具還提供了更多的網(wǎng)站開發(fā)和管理工具，典型的專用工具有Dreamweaver、Frontpage等；n集成開發(fā)環(huán)境中的Web應(yīng)用n如IBM Websphere集成開發(fā)環(huán)境中的Web應(yīng)用工具。利用此Web應(yīng)用工具可以交互地調(diào)試客戶端和服務(wù)器端的代碼，無需編程或較少編程就能構(gòu)造相關(guān)的數(shù)據(jù)驅(qū)動網(wǎng)頁，簡化開發(fā)過程。 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)n網(wǎng)頁制作實(shí)例 n利用Dreamweaver編寫網(wǎng)頁： 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)n將網(wǎng)頁發(fā)布到服務(wù)器 n方法：n使用專用的文件傳送工具，如Cuteftp等；n使用集成

34、在如Dreamweaver中的文件發(fā)布功能 例例 將將Dreamweamer中制作的網(wǎng)頁上傳到遠(yuǎn)程中制作的網(wǎng)頁上傳到遠(yuǎn)程Apache站點(diǎn)。操作步驟如下：站點(diǎn)。操作步驟如下：1）用）用站點(diǎn)站點(diǎn)菜單下的菜單下的新建站點(diǎn)新建站點(diǎn)功能建立一個新站點(diǎn)，站點(diǎn)屬性設(shè)置示例如下：功能建立一個新站點(diǎn)，站點(diǎn)屬性設(shè)置示例如下： 本地信息：站點(diǎn)名稱為：本地信息：站點(diǎn)名稱為：mysite1 本地根文件夾：本地根文件夾：d:mysite1 遠(yuǎn)程信息：訪問：本地遠(yuǎn)程信息：訪問：本地/網(wǎng)絡(luò)網(wǎng)絡(luò) 遠(yuǎn)程文件夾：遠(yuǎn)程文件夾：d:program filesapache groupsapachehtdocs 測試服務(wù)頁：服務(wù)器模型：無

35、測試服務(wù)頁：服務(wù)器模型：無 2）新建一個）新建一個HTML頁，內(nèi)容不妨為簡單的字符串頁，內(nèi)容不妨為簡單的字符串“mytest mytest”,并存盤為并存盤為bb1.htm文件；文件；3）在站點(diǎn)窗口中，利用文件上傳的功能將文件）在站點(diǎn)窗口中，利用文件上傳的功能將文件bb1.htm上傳到遠(yuǎn)程的上傳到遠(yuǎn)程的Apache服務(wù)器上；服務(wù)器上；4）打開瀏覽器進(jìn)行測試）打開瀏覽器進(jìn)行測試 2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁2.3 靜態(tài)頁面的表達(dá)及其技術(shù)例例 若遠(yuǎn)程端安裝有若遠(yuǎn)程端安裝有Tomcat服務(wù)器，將服務(wù)器，將Dreamweamer中制作的網(wǎng)頁上傳到遠(yuǎn)程端。中制作的網(wǎng)頁上傳到遠(yuǎn)程端。操作步

36、驟：操作步驟：1）用）用站點(diǎn)站點(diǎn)菜單下的菜單下的新建站點(diǎn)新建站點(diǎn)功能建立一個新站點(diǎn)，設(shè)置屬性設(shè)置示例如下：功能建立一個新站點(diǎn)，設(shè)置屬性設(shè)置示例如下： 本地信息：站點(diǎn)名稱為：本地信息：站點(diǎn)名稱為：mysite1 本地根文件夾：本地根文件夾：d:mysite1 遠(yuǎn)程信息：訪問：本地遠(yuǎn)程信息：訪問：本地/網(wǎng)絡(luò)網(wǎng)絡(luò) 遠(yuǎn)程文件夾：遠(yuǎn)程文件夾：d:program filestomcat4webappsroot 測試服務(wù)頁：服務(wù)器模型：測試服務(wù)頁：服務(wù)器模型：JSP 訪問：本地訪問：本地/網(wǎng)絡(luò)網(wǎng)絡(luò) 測試服務(wù)器文件夾：測試服務(wù)器文件夾：D:Program Filestomcat4webappsROOT2）建一個建一個JSP頁，內(nèi)容不妨為表頁，內(nèi)容不妨為表2-11中的內(nèi)容中的內(nèi)容,并存盤為并存盤為cc1.jsp文件；文件；3）在站點(diǎn)窗口中，利用文件上傳的功能將文件在站點(diǎn)窗口中，利用文件上傳的功能將文件cc1.jsp上傳到遠(yuǎn)程的上傳到遠(yuǎn)程的Tomcat中；中；4）打開瀏覽器進(jìn)行測試）打開瀏覽器進(jìn)行測試2 商務(wù)表達(dá)層與靜態(tài)網(wǎng)頁商務(wù)