從XML生成可與Ajax共同使用的JSON

1、從 XML 生成可與 Ajax 共同使用的 JSON時下，非常流行使用 JavaScript 代碼為數(shù)據(jù)驅(qū)動的 Web 應(yīng)用程序添加互動性。若能將數(shù)據(jù)編碼成 JavaScript Object Notation（JSON）的格式，您就可以更輕松地通過 JavaScript 語言使用它。通過本文，發(fā)掘使用 XSLT V2 從 XML 數(shù)據(jù)生成 JSON 的幾種不同方法。幾年前，許多開發(fā)人員很看好 XML、XSLT、Extensible HTML （XHTML）和其他一些基于標(biāo)記的語言。現(xiàn)在，Asynchronous JavaScript and XML（AJAX）成了新的熱點(diǎn)，人們又將目光轉(zhuǎn)向了

2、使用 JavaScript 代碼的數(shù)據(jù)驅(qū)動的富 Internet 應(yīng)用程序。但是開發(fā)人員是否已經(jīng)消除了 XML 和這一新技術(shù)之間的鴻溝呢？當(dāng)然，您可以在 Web 客戶機(jī)中使用 XML 解析器來讀取數(shù)據(jù)，但這種做法會帶來兩個問題。第一，出于安全方面的原因，XML 數(shù)據(jù)只能從與此頁面相同的那個域中讀取。這雖然不是什么大的限制因素，但它的確會引起部署方面的問題，還會阻礙 DHTML 小部件的創(chuàng)建。第二，讀取和解析 XML 會非常慢。另一種做法是讓服務(wù)器執(zhí)行 XML 的解析工作，方法是設(shè)置服務(wù)器，使之向?yàn)g覽器發(fā)送以 JavaScript 代碼或時下流行的 JavaScript Object Notat

3、ion（JSON）編碼的數(shù)據(jù)。本文將展示如下三種使用 XSLT V2 語言和 Saxon XSLT V2 處理器從 XML 數(shù)據(jù)生成 JSON 的技巧： 簡單編碼 通過函數(shù)調(diào)用加載數(shù)據(jù) 編碼對象 JSON 簡介要學(xué)習(xí)如何將數(shù)據(jù)編碼成 JSON（它只是 JavaScript 的一個子集），最好的方法是從數(shù)據(jù)開始。清單 1 顯示了書籍列表的一個示例 XML 數(shù)據(jù)集。清單 1. 基本的圖形化圖書館Jack Herrington Manning Jack Herrington O'Reilly Jack Herrington O'Reilly 這個數(shù)據(jù)集很簡單，只包含三本書，每本書都具

4、有惟一的 ID、書名、作者姓名及出版商的名字。（沒錯，我只選擇了我自己的書作為數(shù)據(jù)集，但能怨我嗎？這些書實(shí)在是不可多得的節(jié)日和生日禮物。）清單 2 顯示了這些數(shù)據(jù)在 JSON 中的效果。清單 2. JSON 中的示例數(shù)據(jù)集 id: 1,title: 'Code Generation in Action',first: 'Jack',last: 'Herrington',publisher: 'Manning' ,. 方括號 ( 表明這是一個數(shù)組。大括號 ( 則表明這是一個散列表，該散列表由一組名稱和值對組成。在本例中，我創(chuàng)建了一個

5、散列表的數(shù)組 用來存儲這類結(jié)構(gòu)式數(shù)據(jù)的一種常見方法。另外一點(diǎn)值得注意的是字符串是通過單引號或雙引號被編碼的。所以，如果我想用單引號編碼 O'Reilly，我就必須使用反斜杠對它進(jìn)行轉(zhuǎn)義：'O'Reilly'。 這讓我編寫的這個 XSLT 樣式表更為有趣了一些。我并未在本例中放上任何日期，但您也可以通過如下兩種方法來編碼日期。第一種方法是將日期作為字符串，該字符串必須在后面被解析。第二種方法是將日期作為一個對象，比如：publishdate: new Date( 2006, 6, 16, 17, 45, 0 這段代碼將 publishdate 的值設(shè)置為6/16/

6、2006 5:45:00 p.m.。簡單編碼接下來我將陸續(xù)介紹 JSON 編碼的幾種技巧。第一種也是其中最簡單的一種，此樣式表如 清單 3 所示。清單 3. simple.xsl 樣式表xmlns:xsl="/1999/XSL/Transform" version="2.0"xmlns:js="">var g_books = , id: ,name: ' ',first: ' ',last: ' ',publisher: ' '要理解

7、此樣式表，不妨先來看一下 清單 4 所示的輸出。清單 4. simple.xsl 的輸出var g_books = id: 1,name: 'Code Generation in Action',first: 'Jack',last: 'Herrington',publisher: 'Manning', id: 2,name: 'PHP Hacks',first: 'Jack',last: 'Herrington',publisher: 'O'Reilly',

8、 id: 3,name: 'Podcasting Hacks',first: 'Jack',last: 'Herrington',publisher: 'O'Reilly'這里，我將名為 g_books 的變量設(shè)置為一個包含三個散列表的數(shù)組，每個散列表包含關(guān)于該書的信息。再回過頭來看看 清單 3，您會發(fā)現(xiàn)第一個模板匹配 "/" 路徑，它也是首先應(yīng)用到輸入數(shù)據(jù)集的模板，該模板使用 for-each 循環(huán)來遍歷每本書。之后，它使用 標(biāo)記來將文本從該數(shù)據(jù)輸出到 JavaScript 輸出代碼。對于字符串，我使

9、用名為 js:escape( 的定制函數(shù)，它在模板之前定義。該函數(shù)使用一個正則表達(dá)式將一個單引號標(biāo)記更改為帶有反斜杠的單引號標(biāo)記。最后一個重要的元素是 標(biāo)記，它告知處理器要輸出的是文本而不是 XML。要檢驗(yàn)此過程是否可以正常工作，我加入了一個 simple .html 文件，該文件引用我在 simple.js 保存的 XSL 樣式表的輸出。這個 HTML 文件如 清單 5 所示。清單 5. simple.html 文件.html 文件使用 稍后將詳細(xì)介紹 drawbooks 函數(shù)。這里重要的是了解一下頁面如何定義 AddBooks 函數(shù)，該函數(shù)隨后會由 function1.js 文件中的腳本調(diào)

10、用。該 AddBooks 函數(shù)負(fù)責(zé)處理數(shù)據(jù)。而且被調(diào)用的 AddBooks 函數(shù)會向頁面指示 .這里更改了 XSLT，以使函數(shù)調(diào)用駐留在 for-each 循環(huán)體內(nèi)。清單 12 顯示了更新后的樣式表。清單 12. function2.xsl.AddBook( id: ,name: ' ',first: ' ',last: ' ',publisher: ' ' ;.對這個給定示例來說，這種更改看起來有些隨意。但如果原始的 XML 數(shù)據(jù)集有多種數(shù)據(jù)類型，要為每種類型分配一個單獨(dú)的函數(shù)調(diào)用會使 XSL 和頁面上的 JavaScript

11、代碼更為簡單、更易于維護(hù)。編碼對象對小的頁面來講，使用 JavaScript 函數(shù)沒有問題。但對于大型項(xiàng)目，就需要使用 JavaScript 語言的一些面向?qū)ο筇匦?。是的，JavaScript 語言可以處理對象而且可以處理得很好。清單 13 顯示了如何創(chuàng)建帶有數(shù)據(jù)的對象。清單 13. Object1.jsg_books.push( new Book( id: 1,name: 'Code Generation in Action',first: 'Jack',last: 'Herrington',publisher: 'Manning

12、9; ;g_books.push( new Book( id: 2,name: 'PHP Hacks',first: 'Jack',last: 'Herrington',publisher: 'O'Reilly' ;在本例中，我只簡單地向名為 g_books 的數(shù)組添加了 Book 對象。JavaScript 的對象創(chuàng)建與 Java、C# 或 C+ 編程語言的對象創(chuàng)建十分相似。都是一個 new 操作符后跟一個類名。參數(shù)放到隨后的括號內(nèi)。在本例中，我傳入了一個帶值的單一散列表，并將其分割成單獨(dú)的一些參數(shù)。創(chuàng)建此對象的代碼如

13、清單 14 所示。清單 14. Object1.xslg_books.push( new Book( id: ,name: ' ',first: ' ',last: ' ',publisher: ' ' ;此頁面內(nèi)最值得注意的是定義 Book 類的那部分代碼。清單 15 顯示了該頁面。清單 15. object1.html.Book 類的構(gòu)造函數(shù)循環(huán)訪問散列表的所有數(shù)據(jù)。對于每個鍵，會在對象上創(chuàng)建一個具有對象名稱和數(shù)據(jù)的實(shí)例變量。不需要對 drawbooks 函數(shù)做任何修改，因?yàn)閷ο蠖加信c原始的散列表相同的鍵和值。JavaScri

14、pt 語言并不區(qū)分訪問的是散列表內(nèi)的命名值還是對象上的命名值。當(dāng)然，Book 類應(yīng)該有像 set 和 get 這樣的訪問程序。 清單 16 顯示了我是如何對 JavaScript 數(shù)據(jù)進(jìn)行編碼的。清單 16. Object2.jsvar b1 = new Book(;b1.setId ( 1 ;b1.setTitle ( 'Code Generation in Action' ;b1.setFirst ( 'Jack' ;b1.setLast ( 'Herrington' ;b1.setPublisher ( 'Manning'

15、;g_books.push( b1 ;var b2 = new Book(;b2.setId ( 2 ;b2.setTitle ( 'PHP Hacks' ;.沒錯，這有些大同小異。它也是先創(chuàng)建一個對象，設(shè)置其值，然后將它添加到數(shù)組，等等。首先，我對樣式表做了一些較大的修改，如 清單 17 所示。清單 17. Object2.xsl.var = new Book(;( ;( ' ' ;( ' ' ;( ' ' ;( ' ' ;g_books.push( b ;.我定義了一個新的名為 createbook 的函數(shù)，該函數(shù)構(gòu)建 book 對象，并由用于每本書的模板調(diào)用。createbook 函數(shù)還是調(diào)用 escape 函數(shù)來確保字符串被正確編碼?？紤]到 HTML 方面，我必須向 Book 類添加更多方法以便編碼后的 JavaScript 代碼能夠調(diào)用它們。這些新方法如 清單 18 所示。清單 18. Object2.html.原型