第 第 8 8 章 客戶端網頁的章 客戶端網頁的 XMLXML

Data IslandData Island 與與 Data Data BindingBinding- - 什麼是什麼是 Data IslandData Island 透過透過 CGICGI 、、 PerlPerl 技術或者更先進的技術或者更先進的

PHPPHP 、、 ASPASP 、、 ASP.NETASP.NET 與與 JSP…JSP… 等動態網頁技術，等動態網頁技術，提供瀏覽者檢視及處理伺服器上的資料。但是當瀏覽提供瀏覽者檢視及處理伺服器上的資料。但是當瀏覽者越來越多時，伺服端的運算資源與網路頻寬將快速者越來越多時，伺服端的運算資源與網路頻寬將快速消耗。消耗。

為了降低客戶端對伺服端的依賴，微軟提出了將資料為了降低客戶端對伺服端的依賴，微軟提出了將資料暫存在客戶端，並可直接在客戶端顯示與修改的機制。暫存在客戶端，並可直接在客戶端顯示與修改的機制。

這個技術使得伺服端可以一次就送出客戶端需要的資這個技術使得伺服端可以一次就送出客戶端需要的資料，並由客戶端自行依需要處理，達到善用客戶端計料，並由客戶端自行依需要處理，達到善用客戶端計算資源，減輕伺服端負擔的目的。這個暫存在客戶端算資源，減輕伺服端負擔的目的。這個暫存在客戶端的資料，被稱之為的資料，被稱之為資料島資料島（（ Data IslandData Island ）。）。

Data IslandData Island 與與 Data Data BindingBinding- - 微軟的微軟的 Data BindingData Binding 技術技術 微軟為了在微軟為了在 HTMLHTML 網頁內顯示與處理客戶端網頁內顯示與處理客戶端

暫存資料（暫存資料（ Data IslandData Island ）的技術，提出了資）的技術，提出了資料連結（料連結（ Data BindingData Binding ）技術，架構圖如下所）技術，架構圖如下所示：示：

DSODSO 物件的運用物件的運用- - 顯示顯示 HTMLHTML 網頁內的網頁內的 XMLXML 文件文件 運用運用 XMLXML 文件做為文件做為 Data IslandData Island

在在 HTMLHTML 網頁運用網頁運用 XMLXML 標籤載入標籤載入 XMLXML 文件，做為文件，做為 Data Data IslandIsland ，並建立，並建立 DSODSO 物件的語法如下：物件的語法如下：<XML id=<XML id= 物件名稱 物件名稱 src=XMLsrc=XML 文件名稱與位置 文件名稱與位置 async=async= 是否先是否先

載入載入 >>

文件內容文件內容</XML></XML>

以下敘述將把描述以下敘述將把描述『『 Access 2007 Access 2007 徹底研究徹底研究』』書籍資料的書籍資料的XMLXML 文件，建立為文件，建立為 DSODSO 物件，並命名為物件，並命名為 A1153A1153 。。

DSODSO 物件的運用物件的運用- - 顯示顯示 HTMLHTML 網頁內的網頁內的 XMLXML 文件文件 以下敘述則從以下敘述則從 HTMLHTML 網頁所在資料夾位置，載入名為網頁所在資料夾位置，載入名為

A1153.xmlA1153.xml 的的 XMLXML 文件，並命名為文件，並命名為 A1153A1153 。請參考。請參考範例範例 8-28-2 的說明。的說明。

DSODSO 物件的運用物件的運用- - 顯示顯示 HTMLHTML 網頁內的網頁內的 XMLXML 文件文件 在在 HTMLHTML 標籤內引用標籤內引用 DSODSO 物件物件

在在 HTMLHTML 網頁內與網頁內與 DSODSO 物件連結，並顯示物件內資物件連結，並顯示物件內資料的料的 HTMLHTML 標籤稱為標籤稱為 DCDC （（ Data ConsumersData Consumers ）。這）。這類類 HTMLHTML 標籤將透過設定標籤將透過設定 datasrcdatasrc 屬性與屬性與 dataFlddataFld 屬屬性的方式，指定欲連結的性的方式，指定欲連結的 DSODSO 物件與欄位。物件與欄位。

以下敘述將設定以下敘述將設定 spanspan 標籤，連結至名為標籤，連結至名為 A1153A1153 的的DSODSO 物件，連結欄位為物件，連結欄位為 titletitle 。。

DSODSO 物件的運用物件的運用- - 運用表格顯示運用表格顯示 XMLXML 文件資料文件資料 以下敘述，將建立一個顯示以下敘述，將建立一個顯示 bookdsobookdso 物件內物件內

titletitle 、、 authorauthor 與與 priceprice 欄位，所有資料的表格。欄位，所有資料的表格。

DSODSO 物件的運用物件的運用- - 運用表格顯示運用表格顯示 XMLXML 文件資料文件資料 以下敘述將運用巢狀表格顯示包含以下敘述將運用巢狀表格顯示包含 pennamepenname 與與

namename 的的 authorauthor 巢狀元素。 巢狀元素。

DSODSO 物件的運用物件的運用- - 屬性的顯示屬性的顯示 運用運用 DSODSO 物件時，物件時， XMLXML 文件內元素的屬性可視為一文件內元素的屬性可視為一

個獨立的元素，直接將屬性名稱設定給個獨立的元素，直接將屬性名稱設定給 HTMLHTML 標籤的標籤的dataFlddataFld 屬性，即可顯示屬性內容。屬性，即可顯示屬性內容。

以下敘述將運用以下敘述將運用 spanspan 標籤直接利用屬性名稱，列出標籤直接利用屬性名稱，列出bookbook 元素的元素的 salesale 屬性，且不需要指定該屬性所屬的元屬性，且不需要指定該屬性所屬的元素。素。

DSODSO 物件的運用物件的運用- - 屬性的顯示屬性的顯示 其實瀏覽器會將元素的屬性，解譯為一個獨立的元素，其實瀏覽器會將元素的屬性，解譯為一個獨立的元素，

然後將元素內容，建立為包含於原元素的然後將元素內容，建立為包含於原元素的 $text$text 元素。元素。 以下為包含以下為包含 pennamepenname 屬性的屬性的 authorauthor 元素。元素。

將被解譯為將被解譯為

DSODSO 物件的運用物件的運用- - 可連結的可連結的 HTMLHTML 標籤標籤 文字方塊文字方塊

在在 HTMLHTML 網頁內，文字方塊將用於輸入文字，如下圖網頁內，文字方塊將用於輸入文字，如下圖所示。所示。

建立語法如下：建立語法如下：<Inupt Type = text Name=<Inupt Type = text Name= 文字方塊名稱 文字方塊名稱 Value=Value= 傳出值傳出值 >>

以下敘述將設定文字方塊連結至以下敘述將設定文字方塊連結至 bookdsobookdso 物件的物件的 titletitle欄位。欄位。

DSODSO 物件的運用物件的運用- - 可連結的可連結的 HTMLHTML 標籤標籤 核取方塊核取方塊

核取方塊用於表達資料型態為布林值的欄位，如下圖所核取方塊用於表達資料型態為布林值的欄位，如下圖所示。示。

建立語法如下：建立語法如下：<Inupt Type = check Name=<Inupt Type = check Name= 核取方塊名稱核取方塊名稱 checked>checked>

以下敘述將設定核取方塊連結至以下敘述將設定核取方塊連結至 bookdsobookdso 物件的物件的 onsaleonsale欄位，表達該欄位值所代表的布林值。欄位，表達該欄位值所代表的布林值。

DSODSO 物件的運用物件的運用- - 可連結的可連結的 HTMLHTML 標籤標籤 組合方塊組合方塊

組合方塊用於提供使用者以選取方式，設定資料的功能，組合方塊用於提供使用者以選取方式，設定資料的功能，如下圖所示。如下圖所示。

建立語法如下：建立語法如下：<SELECT Name=<SELECT Name= 控制項名稱控制項名稱 >>

<OPTION Value=<OPTION Value= 傳出值傳出值 1 1 Selected>Selected> 選項選項 1</OPTION>1</OPTION><OPTION Value=<OPTION Value= 傳出值傳出值 2>2> 選項選項 2</OPTION>2</OPTION>…………<OPTION Value=<OPTION Value= 傳出值傳出值 N>N> 選項選項 N</OPTION>N</OPTION>

</SELECT></SELECT>

DSODSO 物件的運用物件的運用- - 可連結的可連結的 HTMLHTML 標籤標籤 以下敘述，將建立一個連結至以下敘述，將建立一個連結至 bookdsobookdso 物件物件 priceprice 欄位的組欄位的組

合方塊，並提供三種價格供使用者選取。 合方塊，並提供三種價格供使用者選取。

DSODSO 物件的運用物件的運用- - 可連結的可連結的 HTMLHTML 標籤標籤 選擇鈕選擇鈕

用於代表連結欄位值，為數個值其中一個，如下圖所用於代表連結欄位值，為數個值其中一個，如下圖所示。示。

建立語法如下：建立語法如下：<Inupt Type = radio Name=<Inupt Type = radio Name= 選擇鈕名稱 選擇鈕名稱 Value=Value= 傳出值 傳出值

checked>checked> 以下敘述將建立一個名為以下敘述將建立一個名為 authorauthor 的選項群組，並連結的選項群組，並連結

至至 bookdsobookdso 物件的物件的 authorauthor 欄位。欄位。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 記錄集與欄位資料的取得記錄集與欄位資料的取得 取得取得 XML DSOXML DSO 物件的記錄集物件的記錄集

若想要動態瀏覽與操作客戶端瀏覽器的若想要動態瀏覽與操作客戶端瀏覽器的 XML DSOXML DSO 物物件，可以運用該物件的件，可以運用該物件的 recordsetrecordset 物件，取得物件，取得 recordsetrecordset物件的語法如下：物件的語法如下：DSODSO 物件物件 .recordset.recordset

以下敘述將取得名為以下敘述將取得名為 A1153A1153 之之 DSODSO 物件的記錄集，並物件的記錄集，並設定給設定給 objRSobjRS 物件。物件。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 記錄集與欄位資料的取得記錄集與欄位資料的取得 取得記錄集的欄位取得記錄集的欄位

若欲取得記錄集的欄位時，語法如下：若欲取得記錄集的欄位時，語法如下：DSODSO 物件物件 .recordset(.recordset( 欄位名稱欄位名稱 ))

以下敘述將取得以下敘述將取得 DSODSO 物件之記錄集的物件之記錄集的 titletitle 欄位，並將欄位，並將值設定給客戶端網頁的值設定給客戶端網頁的 titletitle 物件之物件之 innerTextinnerText 屬性。屬性。

以下敘述先將以下敘述先將 DSODSO 物件的記錄集設定給物件的記錄集設定給 objRSobjRS 物件，物件，再將名為再將名為 titletitle 的欄位資料，設定給的欄位資料，設定給 titletitle 物件的物件的innerTextinnerText 屬性。屬性。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 瀏覽瀏覽 XML DSOXML DSO 物件的記錄集物件的記錄集 操作記錄集的方法操作記錄集的方法

取得取得 recordsetrecordset 物件後，便可運用以下方法，操作記錄的物件後，便可運用以下方法，操作記錄的瀏覽指標。瀏覽指標。

使用使用 VBScriptVBScript ，呼叫，呼叫 recordsetrecordset 物件之方法的語法如下：物件之方法的語法如下：DSODSO 物件物件 .recordset..recordset. 方法方法

使用使用 JavaScriptJavaScript （（ JScriptJScript ），呼叫），呼叫 recordsetrecordset 物件方法的物件方法的語法如下：語法如下：

DSODSO 物件物件 .recordset..recordset. 方法方法 ()()

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 瀏覽瀏覽 XML DSOXML DSO 物件的記錄集物件的記錄集 記錄集屬性的運用記錄集屬性的運用

下表為可使用的下表為可使用的 recordsetrecordset 物件屬性。物件屬性。

使用使用 VBScriptVBScript 或或 JavaScriptJavaScript （（ JScriptJScript ）取得屬性的語法）取得屬性的語法如下：如下：

DSODSO 物件物件 .recordset..recordset. 屬性屬性

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 分頁顯示分頁顯示 XMLXML 文件文件 除了以單筆方式顯示除了以單筆方式顯示 XMLXML 文件資料外，亦可運用表格，文件資料外，亦可運用表格，

以分頁方式，列出數筆記錄。以分頁方式，列出數筆記錄。 運用時，必須在運用時，必須在 TableTable 標籤內，設定下表的屬性。標籤內，設定下表的屬性。

操作顯示資料頁次的方法如下： 操作顯示資料頁次的方法如下：

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 資料的修改與新增資料的修改與新增 運用運用 8-2-48-2-4 節所介紹的節所介紹的 HTMLHTML 控制項，可連結控制項，可連結 DSODSO 物件物件

內的資料，並透過這些控制項，修改內的資料，並透過這些控制項，修改 DSODSO 物件的內容。物件的內容。 至於至於 DSODSO 物件內資料的新增，則必須呼叫物件內資料的新增，則必須呼叫 DSODSO 物件的物件的

recordsetrecordset 物件的物件的 addnew()addnew() 方法，此時，方法，此時， DSODSO 物件將產物件將產生一筆新的記錄，並可由連結生一筆新的記錄，並可由連結 DSODSO 物件的控制項輸入資物件的控制項輸入資料。料。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 資料的搜尋與篩選資料的搜尋與篩選 對於資料的搜尋，對於資料的搜尋， DSODSO 物件或者是物件或者是 DSODSO 物件的記錄集，物件的記錄集，

並沒有提供任何方式。僅能透過自行比對記錄集欄位內資並沒有提供任何方式。僅能透過自行比對記錄集欄位內資料的方式，進行資料的尋找與篩選。料的方式，進行資料的尋找與篩選。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- - 資料的排序資料的排序 對於客戶端對於客戶端 DSODSO 物件內資料的排序，必須藉由物件內資料的排序，必須藉由 XSLXSL檔的檔的協助，執行協助，執行 XMLXML 文件的轉換。文件的轉換。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- DSO- DSO 物件的事件物件的事件 下表為下表為 XML DSOXML DSO 物件可回應事件的說明，藉由回應事件物件可回應事件的說明，藉由回應事件

的機會，程式設計師可執行一些動作。的機會，程式設計師可執行一些動作。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- DSO- DSO 物件的事件物件的事件 欲定義回應某欲定義回應某 DSODSO 物件特定事件的程序之語法如下：物件特定事件的程序之語法如下：

Sub DSOSub DSO 物件名稱物件名稱 __事件名稱事件名稱 ()()…………

End SubEnd Sub 以下敘述將定義回應以下敘述將定義回應 bookdsobookdso 物件物件 onrowenteronrowenter 事件的回事件的回應程序。應程序。

操作操作 XML DSOXML DSO 物件的記錄物件的記錄集集- DSO- DSO 物件的事件物件的事件 欲定義回應某欲定義回應某 DSODSO 物件特定事件的程序之語法如下：物件特定事件的程序之語法如下：

Sub DSOSub DSO 物件名稱物件名稱 __事件名稱事件名稱 ()()…………

End SubEnd Sub 以下敘述將定義回應以下敘述將定義回應 bookdsobookdso 物件物件 onrowenteronrowenter 事件的回事件的回應程序。應程序。