軟體專案實訓及課程設計指導——應用XML+XSLT技術分離Web應用系統中表示層資料和樣式的例項
1、在J2EE應用系統中應用XSLT實現XML文件轉換的基本過程
(1)首先,創建出目標XML格式文件檔案,該XML格式文件檔案代表應用系統中的資料模型
(2)其次,建立出XSLT文件檔案,該XSLT文件檔案代表對XML資料的顯示控制
(3)最後,在XML格式文件檔案中呼叫這個XSLT檔案以便能夠將XML和XSLT相互關聯。
2、在J2EE應用系統中應用"XML+XSLT"技術的應用示例
作者在下文中透過一個示例為讀者介紹如何應用"XML+XSLT"技術徹底分離Web應用系統中表示層頁面中的資料和樣式。
(1)首先,創建出一個XML格式文件檔案
下面的程式碼示例中所示的XML格式文件檔案是一個很簡單XML格式文件,只包含一個節點的XML結構樹。該XML格式文件檔案的內容在實際的企業級應用系統中,可以在Web伺服器端根據系統中業務處理的規則動態創建出,它代表處理結果的XML文件。
本示例中的XML文件檔名稱為FirstXMLFile.xml,具體的內容請見如下的程式碼示例所示—— XML文件檔案FirstXMLFile.xml的內容示例。
<?xml version="1.0" encoding="gb2312" ?><firstXML>這是我在學習XSLT時所寫的一個XML文件中的內容</firstXML >
(2)其次,建立出XSLT格式文件檔案
該XSLT格式文件檔案代表對XML文件中資料的顯示風格控制,在本示例中作者所建立的XSLT文件檔案的檔名稱為FirstXSL.xsl,該檔案中的具體內容請見如下的程式碼示例所示—— XSLT文件檔案FirstXSL.xsl的內容示例。
<?xml version="1.0" encoding="gb2312" ?><xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl" version="1.0"> <xsl:template match="/"> <html> <head> <title>這是我在XSLT時所做的第一個XSLT檔案示例</title> </head> <body> <p><xsl:value-of select="firstXML"/></p> </body> </html> </xsl:template></xsl:stylesheet>
為了方便讀者理解上面示例程式碼中的XSLT文件檔案中的標籤內容的含義,作者在下文中對其中的主要標籤元素加以解釋說明。
1)<xsl:stylesheet>標籤定義一個樣式表
<xsl:stylesheet>標籤的主要功能是將此XSLT文件作為一個樣式表 (StyleSheet) 來處理,從而明確地定義了本XSLT文件的用途。
按照XSLT文件語法的規定,所有的XSL命令都必須包含在<xsl:stylesheet>起始標籤和</xsl:stylesheet>結束標籤之間,也就是說這個<xsl:stylesheet>標籤界定了輸出轉換後的XSL樣式的內容。
其中的xmlns:xsl屬性是一個名字空間宣告(XSL樣式表中所有的指令都必須註明屬於http://www.w3.org/TR/WD-xsl這個XSL專屬的名稱空間),和XML格式文件中的名字空間的使用方法一樣,用來防止標籤元素名稱重複和混亂。其中的字首xsl的意思是文件中使用的標籤元素遵守W3C的XSLT語法規範;最後的version屬性說明樣式表只採用XSLT 1.0的標準功能,這也是目前僅有的標準。
當然,也可以在模板HTML頁面中使用CSS層疊樣式表技術,此時應該在XSLT文件中新增如下的引用語句, 當然也就不再需要<xsl:stylesheet>標籤。
XSLT模板把XSLT文件的設計細化成一個個的模組(每一個模組定義為一個"template",由<xsl:template>標籤定義此模組),最後再把這些模組組合串接成一個完整的XSLT文件檔案。這樣的語法規則能夠實現很好地將資料分塊和隔離。
另外,應用這種方案可以使開發者先從整體上考慮整個XSLT文件的設計,然後再把總體表現形式進一步細化成不同的模組和子模組,再分別具體設計這些模組,最後把它們整合和串接在一起。
<xsl:template>標籤中的屬性match="/"說明在XML源文件中這個模板規則作用的起點。"/"是一種XPath(XML Path Language,XML路徑語言)語法,這裡的"/"代表XML源文件結構樹的根(root)標籤。
3)<xsl:template>標籤定義其中的內容
當模板規則被觸發,模板的內容就會控制輸出的結果。在上面的程式碼示例中,模板大部分內容由HTML標籤元素和文字構成。只有<xsl:value-of>標籤元素是應用XSLT語法規則的標籤,這裡的<xsl:value-of>標籤的主要作用是複製原XML源文件中的一個標籤節點的值到輸出文件中。而其中的select屬性則詳細指定要處理的XML標籤節點名稱——但這是遵守XPath(XML Path Language,XML路徑語言)語法規則。
其中的值"firstXML"的意思就是尋找XML文件根標籤節點名為firstXML的標籤元素(也就是XML文件中的<firstXML>標籤),並用此模板來處理這個<firstXML>標籤節點——也就是找到<firstXML>標籤元素,然後將該標籤元素的值"這是我在學習XSL時所寫的一個XML文件中的內容"按模板的樣式定義複製到輸出檔案(本示例為HTML文件檔案)。因此,轉換後的HTML文件結構清晰、 修改也方便。
當然,讀者也可以用IE5.0以上版本的瀏覽器或者其它瀏覽器開啟這個FirstXSL.xsl檔案,將能夠看到如下示圖所示的XSL的結構樹——因為XSL文件本身也是XML格式的文件,同樣也要遵守XML格式的文件的各種語法規則。
(3)最後,在XML格式文件檔案中呼叫這個XSLT檔案以便能夠將XML文件(代表軟體應用系統中的業務處理後的結果資料)和XSLT(代表對這些結果資料在最終的目標終端裝置中如何顯示和輸出)相互關聯
沒有在上面所示的XML文件檔案中新增對XSLT關聯之前的執行結果狀態為如下示圖所示的顯示結果——無格式化的XML文件檔案的結果,這不利於人類閱讀和理解——因為在資料中還包含有大量的XML格式文件的標籤。
然後在前面所示的XML格式文件檔案中呼叫這個XSLT檔案——這隻需要修改FirstXMLFile.xml中的程式碼為下面的內容以增加格式化轉換的功能實現程式碼。最終的FirstXMLFile.xml檔案的內容請見如下程式碼所示,請讀者注意其中黑體標識的標籤—— 對FirstXMLFile.xml檔案新增格式轉換(引用前面的FirstXSL.xsl樣式表文件)之後的檔案內容示例如下:
請讀者注意,如果讀者在瀏覽器中只看到XML結構樹(請參考前一示圖所示的顯示結果),而不是單獨的"這是我在學習XSLT時所寫的一個XML文件中的內容"字樣,則說明讀者機器中的瀏覽器沒有安裝MSXML3版本的XML Processor(支援XSLT技術的XML 處理器)程式。
讀者可以對比前面的兩個示例圖,明顯地能夠了解到對XML文件檔案經過XSLT的格式轉換後在瀏覽器中能夠按照設計者的要求顯示輸出,並且有利於人類的閱讀和理解。
(4)將它們部署到應用伺服器中執行
為了能夠讓讀者瞭解XML+XSLT技術在Web應用系統開發中的具體應用,也可以將前面的程式碼所示的XML文件檔案FirstXMLFile.xml和XSLT格式文件檔案FirstXSL.xsl都部署到應用伺服器(如 Tomcat等)中。然後在瀏覽器中對該FirstXMLFile.xml檔案進行請求,比如請求的URL地址為:http://127.0.0.1:8080/WebBBS/FirstXMLFile.xml,將能夠看到如下示圖所示的結果——與前面示圖所示的在本地瀏覽的結果是一致的。
讀者從上面示例圖所示的結果應該能夠理解,XML與XSLT相互配合,同樣也能夠構造伺服器端的應用。而且同一個XML格式的文件檔案,只需要提供不同的XSLT格式文件檔案,將可以產生出不同的顯示效果。據此,對於不同的終端裝置, 軟體應用系統的開發人員可以設計出不同的XSLT文件檔案就可以實現相同的資料在不同的終端裝置中顯示出不同的風格。
4、體驗"XML+XSLT"技術中的格式和資料分離的優點
讀者只需要將前面程式碼示例所示的XSLT文件檔案FirstXSL.xsl中的如下的標籤內容:
<p><xsl:value-of select="firstXML"/></p>
改變為如下的標籤內容:
<p><B><xsl:value-of select="firstXML"/></B></p>
也就是對顯示輸出的文字內容應用粗體樣式控制,然後再在Web瀏覽器中瀏覽修改後的頁面瀏覽的效果,將能夠看到如下示圖所示的粗體文字的顯示狀態內容。
因此,如果對XML文件檔案中的內容:"<firstXML>這是我在學習XSL時所寫的一個XML文件中的內容</firstXML >"應用各種不同的XSLT模板處理技術,將可以產生出滿足不同應用需求要求的顯示效果、和滿足不同的顯示裝置的要求,而且"格式控制"和"資料內容"是相互分離。
當然,為了簡化本示例的實現程式碼,作者在本文中直接將XML文件檔案的內容設定為規定內容,其實該XML格式文件檔案的資料內容完全可以在Web伺服器端由相關的程式動態建立或者對原有的XML文件檔案進行修改——XML文件檔案中的資料也可以來自於物理資料庫系統的資料庫表。
因此,軟體應用系統的開發人員可以根據系統業務處理的需要,動態地建立代表業務處理結果的XML格式文件,然後再針對不同的顯示裝置或者終端(如電腦螢幕、手機螢幕、電視螢幕等)提供不同版本的XSLT模板,從而可以保證同一個軟體應用系統的處理結果能夠適用於不同的終端裝置,這將大大地擴大了軟體應用系統的應用場景。
為了能夠讓讀者對"XML+XSLT"相關技術的應用有一定的感性認識,作者給出如下兩個示例圖,它們的XML格式的文件是同一個XML檔案,但透過提供不同的XSLT模板檔案,最後在同一瀏覽器中顯示出不同的結果。這說明了XSLT模板的資料轉換功能的應用效果。
5、利用Macromedia Dreamweaver工具以視覺化方式建立XSLT文件檔案
讀者在實際的專案開發中,如果Web應用系統的表示層開發中需要應用XML+XSLT技術,為了能夠提高開發效率,一般可以應用一些視覺化工具如Macromedia Dreamweaver頁面開發工具建立XSLT格式文件檔案。
作者在下文中為讀者簡要介紹如何利用Macromedia公司的Web頁面開發工具Dreamweaver軟體以視覺化方式建立XSLT文件檔案。
(1)先建立系統中所需要的XML文件檔案
讀者只需要在Dreamweaver頁面開發工具程式中選擇【新建文件】選單,然後彈出如下示例圖所示的【新建文件】對話方塊。讀者只需要在該對話方塊中的【頁面型別】選擇框中選中【XML】型別頁面,將自動地創建出一個空的XML文件檔案。
(2)其次建立系統中所需要的XSLT格式文件檔案
讀者同樣也只需要在Dreamweaver頁面開發工具程式中選擇【新建文件】選單,然後彈出下圖所示的【新建文件】對話方塊。讀者只需要在該對話方塊中的【頁面型別】選擇框中選中【XSLT(整頁)】型別頁面,將自動地創建出一個空的XSLT文件檔案。
然後Dreamweaver頁面開發工具程式自動要求繫結XML資料來源,並彈出下圖所示的【定位XML源】對話方塊,讀者只需要選定在前面示例圖中所生成的XML文件檔案。
(3)在XSLT文件檔案中繫結XML文件檔案中的目標資料
讀者可以在Dreamweaver頁面開發工具程式中選擇【插入記錄】選單中的【XSLT物件】子選單的各個下一級選單專案,在XSLT文件檔案中插入各種控制標籤——請見下圖所示的操作過程的結果截圖。
當然,也可以直接在右面的繫結面板中將可使用的欄位直接拖到XSLT文件檔案視窗中,並且快速選定需要迴圈的部分,最後將自動地插入XSLT迴圈控制標籤——請見下圖所示的操作過程的結果截圖。
(4)將XSLT文件檔案關聯到目標XML文件檔案中
讀者最後只需要將XSLT文件檔案關聯到目標XML文件檔案中,請讀者參考前面程式碼示例中的黑體標識的標籤。最後再開啟XML檔案並附加上對應的目標XSLT樣式表文件,然後存檔儲存。