1.定義介紹
(1).XML定義
擴展標記語言(Extensible Markup Language, XML) ,用於標記電子文件使其具有結構性的標記語言,可以用來標記資料、定義資料類型,是一種允許使用者對自己的標記語言進行定義的來源語言。 XML使用DTD(document type definition)文檔類型定義來組織資料;格式統一,跨平台和語言,早已成為業界公認的標準。
XML是標準通用標記語言 (SGML) 的子集,非常適合 Web 傳輸。 XML 提供統一的方法來描述和交換獨立於應用程式或供應商的結構化資料。
(2).JSON定義
JSON(JavaScript Object Notation)一種輕量級的資料交換格式,具有良好的可讀和便於快速編寫的特性。可在不同平台之間進行資料交換。 JSON採用相容性很高的、完全獨立於語言文字格式,同時也具備類似C語言的習慣(包括C, C++, C#, Java, JavaScript, Perl, Python等)體系的行為。這些特性使JSON成為理想的資料交換語言。
JSON是基於JavaScript Programming Language , Standard ECMA-262 3rd Edition - December 1999 的子集。
2.XML和JSON優缺點
(1).XML的優缺點
.XML的優點
A.格式統一,符合標準;
B.伺服器端和客戶端都需要花費大量程式碼來解析XML端程式碼變得異常複雜且不易維護;
C.客戶端不同瀏覽器之間解析XML的方式不一致,需要重複編寫很多程式碼;
A.資料格式比較簡單,易於讀取,格式都是壓縮的,佔用頻寬小;
『『B. ,客戶端JavaScript可以簡單的透過eval()進行JSON資料的讀取;
C.支援多種語言,包括ActionScript, C, C#, ColdFusion, Java, JavaScript, Perl, PHP, Python, Ruby等伺服器端語言,方便伺服器端的解析;
D.在PHP世界,已經有PHP-JSON和JSON-PHP出現了,偏於PHP序列化後的程式直接調用,PHP伺服器端的物件、陣列等能直接產生JSON格式,便於客戶端的存取提取;
E.因為JSON格式能直接為伺服器端程式碼使用,大大簡化了伺服器端和用戶端的程式碼開發量,且完成任務不變,且易於維護。
A.沒有XML格式這麼推廣的深入人心和喜用廣泛,沒有XML那麼通用性;
XML的解析得考慮子節點父節點,讓人頭昏眼花,而JSON的解析難度幾乎為0。這一點XML輸的真是沒話說。
DOM是把一個資料交換格式XML看成一個DOM對象,需要把XML檔案整個讀入內存,這一點上JSON和XML的原理是一樣的,但是XML要考慮父節點和子節點,這一點上JSON的解析難度小很多,因為JSON建構於兩種結構:key/value,鍵值對的集合;值的有序集合,可理解為數組;
.SAX
SAX不需要整個讀入文件就可以對解析出的內容進行處理,是一種逐步解析的方法。程式也可以隨時終止解析。這樣,一個大的文檔就可以逐步的、一點一點的展現出來,所以SAX適合於大規模的解析。這一點,JSON目前是做不到得。
所以,JSON和XML的輕/重量級的區別在於:
JSON只提供整體解析方案,而這種方法只在解析較少的數據時才能起到良好的效果;
XML提供了對大規模資料的逐步解析方案,這種方案很適合於對大量資料的處理。
(2).關於資料格式編碼及解析難度
.在編碼方面。
雖然XML和JSON都有各自的編碼工具,但是JSON的編碼要比XML簡單,即使不借助工具,也可以寫出JSON程式碼,但要寫出好的XML程式碼就有點困難;與XML一樣, JSON也是基於文字的,而且它們都使用Unicode編碼,且其與資料交換格式XML一樣具有可讀性。
主觀上來看,JSON更為清晰且冗餘更少。 JSON網站提供了JSON語法的嚴格描述,只是描述較短。從整體來看,XML比較適合標記文檔,而JSON更適合進行資料交換處理。
.在解析方面。
在普通的web應用領域,開發者經常為XML的解析傷腦筋,無論是伺服器端產生或處理XML,或是客戶端用 JavaScript 解析XML,都常常導致複雜的程式碼,極低的開發效率。
實際上,對於大多數Web應用來說,他們根本不需要複雜的XML來傳輸數據,XML宣稱的擴展性在此就很少具有優勢,許多Ajax應用甚至直接返回HTML片段來構建動態Web頁面。和返回XML並解析它相比,返回HTML片段大大降低了系統的複雜性,但同時也缺乏了一定的彈性。同XML或 HTML片段相比,資料交換格式JSON 提供了更好的簡單性和靈活性。在Web Serivice應用程式中,至少就目前來說XML仍有不可動搖的地位。
(3).實例比較
XML和JSON都使用結構化方法來標記數據,下面來做一個簡單的比較。
.用XML表示中國部分省市資料如下:
<?xml version="1.0" encoding="utf-8" ?> <country> <name>中国</name> <province> <name>黑龙江</name> <citys> <city>哈尔滨</city> <city>大庆</city> </citys> </province> <province> <name>广东</name> <citys> <city>广州</city> <city>深圳</city> <city>珠海</city> </citys> </province> <province> <name>台湾</name> <citys> <city>台北</city> <city>高雄</city> </citys> </province> <province> <name>新疆</name> <citys> <city>乌鲁木齐</city> </citys> </province> </country>
<2>.用JSON表示中國部分省市資料如下
var country = { name: "中国", provinces: [ { name: "黑龙江", citys: { city: ["哈尔滨", "大庆"]} }, { name: "广东", citys: { city: ["广州", "深圳", "珠海"]} }, { name: "台湾", citys: { city: ["台北", "高雄"]} }, { name: "新疆", citys: { city: ["乌鲁木齐"]} } ] }
,XML有明顯的優勢,畢竟人類的語言更貼近這樣的說明結構。 JSON讀起來更像一個資料塊,讀起來就比較費解了。不過,我們讀起來費解的語言,正是適合機器閱讀,所以透過JSON的索引country.provinces[0].name就能夠讀取「黑龍江」這個值。
編碼的手寫難度來說,XML還是舒服一些,好讀當然就好寫。不過寫出來的字符JSON明顯少很多。去掉空白製表以及換行的話,JSON就是密密麻麻的有用數據,而XML卻包含很多重複的標記字元。
案例運用:省的三級聯動
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/封装Ajax.js" type="text/javascript" charset="utf-8"></script> </head> <body> <select name="provence" id="provence" onchange="chooseP(this.value)"> <option>湖北省</option> </select> <select name="city" id="city" onchange="chooseC(this.value)"> <option>武汉市</option> </select> <select name="area" id="area"> <option>江城区</option> </select> </body> <script> objAJAX.getAjax("get", "xml/Provinces.xml", "", callBackOk, callBackFail, ""); function callBackOk(data) { var provences = data.getElementsByTagName("Province"); /*<Province ID="1" ProvinceName="北京市">北京市</Province> */ for(var i = 0; i < provences.length; i++) { var Potion = document.createElement("option"); //<option><option/> Potion.value = provences[i].getAttribute("ID"); //把id传给value Potion.innerHTML = provences[i].innerHTML; document.getElementById("provence").appendChild(Potion); } } function callBackFail() { alert("服务器出错啦") } //市级联动 function chooseP(id) { objAJAX.getAjax("get", "xml/Cities.xml", "", callBackOkP, callBackFailP, ""); function callBackOkP(data) { document.getElementById("city").innerHTML = ""; //alert( typeof data) var citys = data.getElementsByTagName("City"); //alert(citys.length) /*<City ID="1" CityName="北京市" PID="1" ZipCode="100000">北京市</City>*/ for(var i = 0; i < citys.length; i++){ var Coption = document.createElement("option"); //<option><option/> Coption.value = citys[i].getAttribute("ID"); var PID = citys[i].getAttribute("PID"); if(id == PID) { Coption.innerHTML = citys[i].innerHTML; var dd=Coption.value; document.getElementById("city").appendChild(Coption); } } alert(Cvalue); chooseC(Cvalue); } function callBackFailP() { alert("服务器出错啦") } } //县级联动 function chooseC(id) { objAJAX.getAjax("get", "xml/Districts.xml", "", callBackOkP, callBackFailP, ""); function callBackOkP(data) { document.getElementById("area").innerHTML = ""; //alert( typeof data) var districts = data.getElementsByTagName("District"); //alert(citys.length) /* <District ID="1" DistrictName="东城区" CID="1">东城区</District>*/ for(var i = 0; i < districts.length; i++) { var Xoption = document.createElement("option"); //<option><option/> Xoption.value = districts[i].getAttribute("ID"); var CID = districts[i].getAttribute("CID"); if(id == CID) { Xoption.innerHTML = districts[i].innerHTML; document.getElementById("area").appendChild(Xoption); } } } function callBackFailP() { alert("服务器出错啦") } } </script> </html>