利用母版頁實現網站的快速結構化

摘要：如何簡潔快速地對網站中的網頁實現一致的風格和布局，并集中處理網頁通用功能，以節省網頁的開發和維護工作量，是網站建設所共同面對的問題。通過對ASP.NET 2.0中的一項新技術——母版頁的深入研究，分析了它的構成要素，并結合實例介紹了利用它來解決這類問題的基本原理。

關鍵詞：ASP.NET；框架集；母版頁；內容頁

中圖分類號：TP393文獻標識碼：A文章編號：1009-3044(2008)36-2675-02

Rapid Realization of Web Site Structure Via Master Page

TAI An

(College of Information Science Technology， Hainan University， Danzhou 571737， China)

Abstract: There are some common problems when a web site to be created， such as how to make it easy to define a consistent look and layout for the web pages， and centralize the common functionality. These actions have the function of saving the work of software development and software maintenance. Now， these problems can be solved by a new technology of ASP.NET 2.0，which is named master page. Based on a deep study， its composition elements are analyzed， and its basic principle is introduced with a practical example.

Key words: ASP.NET; frameset; master page; content page

1 引言

一個網站中的網頁往往都會包含網站的徽章和標題、導航菜單或功能按鈕、頁面主體部分和頁注腳部分等，網站設計者希望這些網頁有一個一致的風格和布局，并且希望網頁間公共部分能單獨處理，這就需要網頁內各部分之間以及網頁和網頁之間服從一定的組織形式，這就是網站的結構化。為了實現網站有一個良好的結構，傳統的方法是采用框架集技術。框架集技術是把一個頁面空間分成多個區域，每個區域顯示一個獨立的網頁。但框架集技術面臨兩大問題：一是在VS.NET設計器中已經舍棄了對它的支持，這對頁面設計造成一定的困難；二是它是把多個網頁通過鏈接形式雜湊到一起，這無疑顯得非常凌亂，不利于網站的結構化設計。本文所介紹的母版頁技術，不僅能夠方便地實現框架集效果，而且有效地彌補了框架集的這些缺點，能快速地實現網站的結構化，并大大提高網站的設計、開發和維護效率。下面詳細介紹母版頁。

2 母版頁概述

母版頁是微軟在ASP.NET 2.0中增加了一項新技術，從VS 2005版本開始方便地提供了對它的可視化技術支持。母版頁定義了網頁的“模板”， 為Web應用程序的網頁創建一致的風格和布局，一次修改，就可應用到所有的頁面中。它繼承了框架集的優點，把一個頁面空間分為內容相對不變的區域和內容可變的一個或多個區域。內容相對不變的區域可設計用來展示網頁的公共部分，如頁眉、頁角和導航菜單等。這些公共部分可以是靜態的，如徽章和標題，可通過傳統的創建網頁的方式，如設計標簽和文本框等控件元素來完成；也可以按代碼分離的原則在后臺通過編寫代碼來動態生成，如根據用戶的權限動態生成導航菜單或功能按鈕等。內容可變的區域用來顯示具體的內容，是用另外一個稱為“內容頁”的頁面文件單獨存放。

母版頁和內容頁雖然都是一個獨立的文件，但它們不能脫離對方而存在。母版頁定義了統一的外觀和布局，并集中處理網頁的通用功能，但是沒有具體的頁面內容；內容頁雖然定義了具體的頁面內容，但它沒有構成一個頁面所應該具有的最基本的HTML標簽元素，如html、head和body等，即它不是一個完整的網頁。母版頁和內容頁需要在Web服務器端合并，生成一個完整的HTML頁面才能返回給Web瀏覽器去顯示。母版頁技術體現了它非常獨到的一面，為了方便讀者清除地了解其中的奧秘，有必要先介紹一下其中的名詞術語。

3 術語解釋

3.1 母版頁

母版頁為具有擴展名 .master的ASP.NET 文件，它由第一行的一個特殊的指令：“@Master”指令標識，用法類似于普通.aspx頁的“@Page”指令，如表1中的MasterPage1.master母版頁代碼的開頭部分。母版頁中包含了所有頂級HTML標簽元素，如html、head和body等。母版頁的布局包括兩大部分：1）可以在網站的所有網頁中出現的靜態文本、HTML控件和服務器控件，它們定義了網站頁面的統一外觀。2）一個或多個“內容占位符控件”。

3.2 內容占位符控件

即ContenPlaceHolder控件，如表1中的MasterPage1.master母版頁代碼中間的黑體部分。內容占位符控件定義了在母版頁中可替換出現的內容的區域，而具體的內容由“內容頁”定義。

3.3 內容頁

是一個獨立的擴展名為.aspx的ASP.NET網頁，它定義了在母版頁中內容占位符控件所指示的區域的具體內容。一個母版頁對應多個內容頁。內容頁與普通ASP.NET網頁的不同點：內容頁只能包含“@Page”指令和一個或多個Content控件。“@Page”指令的MasterPageFile屬性用于建立與母版頁的綁定，如表1中內容頁A和內容頁B的源代碼的第一行，指明了它們要使用母版頁MasterPage1所定義的模板；而Content控件的ContentPlaceHolderID 屬性則與母板頁中對應的內容占位符控件相關聯，指明了要替換母版頁中哪個內容占位符控件所定義的區域的內容。Content控件是一個容器控件，內容頁中的所有文本、標記和控件都必須放置在Content控件中。在內容頁中，不包含html和body等頂級HTML元素，只包含具體的內容，因為它在服務器端執行時要嵌入到母版頁的內容占位符中。

4 實現原理

母版頁不能被Web瀏覽器直接訪問，而內容頁是可以的。當Web瀏覽器請求一個內容頁時，Web服務器會調用該內容頁所使用的母版頁，并把它們合并在一起進行編譯，生成一個完整的HTML頁面后返回給Web瀏覽器。

為方便闡述，現列舉三個文件：一個母版頁MasterPage1.master、兩個內容頁：A.aspx和B.aspx。它們的源代碼如表1，其中母版頁中省略了有關布局的控件。

當Web瀏覽器請求訪問內容頁A.aspx時，Web服務器會對它進行編譯。當讀取第一條語句 “@Page”指令時，其中的MasterPageFile屬性指向了母版頁MasterPage1.master，ASP.NET編譯器會自動讀取母版頁MasterPage1。如果母版頁是第一次被請求，則它和內容頁A一起在服務器端編譯。編譯時內容頁A的Content控件的內容合并到母版頁MasterPage1中，替換ContentPlaceHolderID所指示的母版頁MasterPage1中的內容占位符控件ContentPlaceHolder（這里均為ContentPlaceHolder1）所定義的區域，轉化成一個完整的、標準的HTML網頁，再返回給Web瀏覽器。Web瀏覽器得到該HTML網頁后解析之，并呈現出合并之后的頁面效果。執行過程如圖1所示。

除了以上執行過程中母板頁表現出來的特點外，母板頁還有一大特點：母板頁只編譯一次。母板頁一經編譯，其編譯之后的代碼既可重復多次使用。例如，當Web瀏覽器再訪問內容頁B.aspx時，Web服務器通過讀取“@Page”指令，發現它也使用了母版頁MasterPage1，那么母版頁MasterPage1就不再被編譯，而只編譯內容頁B，然后將這兩個編譯之后的代碼合并輸出到一個完整地HTML網頁。

表1 母版頁及內容頁的源代碼

圖1 母版頁與內容頁合并輸出示意圖

Web服務器端的這個合并編譯過程對瀏覽器來說是透明的。瀏覽器請求的是一個.aspx網頁，根本就不知道它是不是一個內容頁，而且也不需知道。如果請求的是一個內容頁，Web服務器自動找到與它對應的母版頁進行合并編譯，之后就和一個普通的.aspx網頁的執行過程無異。

通過這種在服務器端的加工合并處理，在客戶端展現完整的頁面，讓用戶感覺是在訪問一個個獨立的網頁，但是網頁中共同的部分卻只在一個文件——母版頁中定義了。利用母版頁，可以方便地創建應用于網站所有網頁的控件和文本，定義統一的外觀和布局，并能集中處理網頁通用功能，不僅輕松地實現傳統方式下的框架集效果，而且性能遠遠超出了它。

5 結束語

ASP.NET 2.0采用母版頁技術，實現了頁面框架和頁面內容的分離，使得網站的前臺頁面設計人員和后臺的開發人員的分工越來越明確，提高了設計效率和開發效率，也方便了Web應用程序的維護和更新。而且，因為母版頁只編譯一次，就應用在網站的所有網頁中，這無疑又大大提高了Web應用程序的執行效率。在實際應用中，通常把母版頁文件放在網站的根目錄下，然后把各個內容頁分門別類地放在不同的子文件夾下，使得網站的結構簡潔明了。

總之，微軟提出的母版頁這個新技術好處太多了，本文只作出一定的介紹和引導，希望大家好好挖掘和利用。

參考文獻：

[1] ASP.NET母版頁概述[EB／OL].http:／／msdn.microsoft.com／zh-cn／library／wtxbf3hh(VS.80).aspx.

[2] 利用母版頁快速標準化站點[EB／OL].http:／／www.microsoft.com／china／MSDN／library／WebServices／ASP.NET／StandardizeYourSiteFastWithMasterPages.mspx?mfr=true.

[3] ASP.NET網站結構[EB／OL].http:／／msdn.microsoft.com／zh-cn／library／ms227432.aspx.