HTML、XML和JSON學習匯總
- 1. HTML語言
- 2. XML語言
- 2.1 XML的特點
- 2.2 XML與HTML的主要差異：
- 2.3 XML允許自定義標簽
- 2.4 XML的解析
- 3. JSON語言
- 3.1 JSON的語法規則
- 3.2 如何使用JSON？
- 3.3 XML和JSON對比
寫在前面：樓主也是剛剛接觸這方面的知識，之前完全是零基礎，後來經朋友推薦了幾個不錯的博文，看完以後豁然開朗。但是此博文更加偏重於基礎知識介紹（其實更深的樓主也還不了解，這方面的大神請繞道），只是分享個人的一個學習總結。希望那些跟我一樣，在實驗室悶頭搞科研，一出門實習完全一頭霧水的同僚們可以借鑒：好多東西並沒有我們想想的那麽復雜，只要你肯學，邁出第一步，你就成功了一大半。與大家共勉！
好了，想花時間接著往下看的博友們，我們可以步入正題了。
回到頂部1. HTML語言
首先，先簡單的提及一下超文本標記語言HTML(HyperText Markup Language)。對於HTML語言，大家一定不陌生，沒吃過豬肉，可總見過豬跑吧。
簡單來說，超文本標記語言HTML是為“網頁創建和其它可在網頁瀏覽器中看到的信息”設計的一種標記語言。“超文本”就是指頁面內可以包含圖片、鏈接，甚至音樂、程序等非文字元素。“標記”是指計算機所能理解的信息符號，通過此種標記，計算機之間可以處理包含各種信息的文章等。有關HTML的具體細節就不具體介紹了，只要記住以下三點就可以了：
- 網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超級文本標記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立在超文本基礎之上的。萬維網盛行的原因，很大程度上都要歸功於HTML。
- 超文本標記語言的結構包括“頭”部分（Head）、和“主體”部分（Body），其中“頭”部提供關於網頁的信息，“主體”部分提供網頁的具體內容。
- HTML被設計的目的是用來實現數據。
2. XML語言
擴展標記語言 XML(Extensible Markup Language) 的規範定義：用於標記電子文件使其具有結構性的標記語言，可以用來標記數據、定義數據類型，是一種允許用戶對自己的標記語言進行定義的源語言。 XML使用DTD(document type definition)文檔類型定義來組織數據;格式統一，跨平臺和語言，早已成為業界公認的標準。XML是標準通用標記語言 (SGML) 的子集，非常適合 Web 傳輸。XML 提供統一的方法來描述和交換獨立於應用程序或供應商的結構化數據。
簡單說，XML就是一種數據的描述語言，雖然它是語言，但是通常情況下，它並不具備常見語言的基本功能——被計算機識別並運行。只有依靠另一種語言，來解釋它，使它達到你想要的效果或被計算機所接受。XML是獨立於軟件和硬件的信息傳輸工具。 目前，XML在Web中起到的作用不會亞於一直作為 Web 基石的 HTML，XML無所不在。XML是各種應用程序之間進行數據傳輸的最常用的工具，並且在信息存儲和描述領域變得越來越流行。
回到頂部2.1 XML的特點
關於XML，記住以下幾點就行了：
- XML是一種標記語言，很類似HTML
- XML的設計宗旨是傳輸數據，而非顯示數據
- XML標簽沒有被預定義。您需要自行定義標簽。
- XML被設計為具有自我描述性。
- XML是W3C的推薦標準
2.2 XML與HTML的主要差異：
- XML不是HTML的替代。
- XML和HTML為不同的目的而設計：XML被設計為傳輸和存儲數據，其焦點是數據的內容；HTML被設計用來顯示數據，其焦點是數據的外觀。
- HTML旨在顯示信息，而 XML 旨在傳輸信息。
- XML是一種重量級的數據交換格式語言（詳細的解釋會在JSON的介紹中提及）。
誤區：XML不是用來取代HTML的，它是HTML的補充。
回到頂部2.3 XML允許自定義標簽
XML被設計用來結構化、存儲以及傳輸信息，它沒有預定義的標簽。在HTML中使用的標簽（以及HTML的結構）是預定義的。HTML文檔只使用在HTML標準中定義過的標簽（比如<p>，<h1> 等等）。XML允許創作者定義自己的標簽和自己的文檔結構。
舉個簡單的例子，比如John寫給George的便簽，存儲為XML：
<note> <to>George</to> <from>John</from> <heading>Reminder</heading> <body>Don‘t forget the meeting!</body> </note>
上面的這條便簽具有自我描述性。它擁有標題以及留言，同時包含了發送者和接受者的信息。但是，這個 XML 文檔仍然沒有做任何事情。它僅僅是包裝在XML標簽中的純粹的信息。我們需要編寫軟件或者程序，才能傳送、接收和顯示出這個文檔。
回到頂部2.4 XML的解析
XML目前設計了兩種解析方式：DOM和 SAX。
1）DOM：把一個數據交換格式XML看成一個DOM對象，需要把XML文件整個讀入內存。
2）SAX：不需要整個讀入文檔就可以對解析出的內容進行處理，是一種逐步解析的方法。程序也可以隨時終止解析。這樣，一個大的文檔就可以逐步的、一點一點的展現出來，所以SAX適合於大規模的解析。
有關XML的詳細的語法和解析介紹，可以轉至下面的鏈接：
10分鐘掌握XML、JSON及其解析
回到頂部3. JSON語言
JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。它基於JavaScript的一個子集。 JSON采用完全獨立於語言的文本格式，但是也使用了類似於C語言家族的習慣（包括C, C++, C#, Java, JavaScript, Perl, Python等）。這些特性使JSON成為理想的數據交換語言。易於人閱讀和編寫，同時也易於機器解析和生成。
回到頂部3.1 JSON的語法規則
JSON 語法是 JavaScript 對象表示語法的子集。
- 數據在名稱/值對中
- 數據由逗號分隔
- 花括號保存對象
- 方括號保存數組
“Name” ： “Poll”這很容易理解，等價於這條 JavaScript 語句：
Name=“Poll”2）JSON 值可以是：
- 數字（整數或浮點數）
- 字符串（在雙引號中）
- 邏輯值（true 或 false）
- 數組（在方括號中）
- 對象（在花括號中）
- null
3）JSON有兩種數據結構：
- 對象：對象在js中表示為“{}”括起來的內容，數據結構為 {key：value,key：value,...}的鍵值對的結構，在面向對象的語言中，key為對象的屬性，value為對應的屬性值，所以很容易理解，取值方法為 對象.key 獲取屬性值，這個屬性值的類型可以是 數字、字符串、數組、對象幾種。
- 數組：數組在js中是中括號“[]”括起來的內容，數據結構為 ["java","javascript","vb",...]，取值方式和所有語言中一樣，使用索引獲取，字段值的類型可以是 數字、字符串、數組、對象幾種。
{
"people": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"},
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]
}
當然，你還可以表示的更復雜一些，例如這樣：
{ "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
] }
這裏最值得註意的是，能夠表示多個值，每個值進而包含多個值。但是還應該註意，在不同的主條目（programmers、authors 和 musicians）之間，記錄中實際的名稱 / 值對可以不一樣。JSON 是完全動態的，允許在 JSON 結構的中間改變表示數據的方式。在處理 JSON 格式的數據時，沒有需要遵守的預定義的約束。所以，在同樣的數據結構中，可以改變表示數據的方式，甚至可以以不同方式表示同一事物。
看到這裏，大家一定覺得JSON很容易理解吧。為大家提供一個小工具：JSON在線校驗格式化工具bejson，可以自己嘗試著在這裏編寫一寫簡單的JSON。
回到頂部3.2 如何使用JSON？
講了這麽多，大家一定想知道如何來使用JSON，JSON最常用的兩種使用方法分別是JavaScrip（JS）和.Net，詳細地細則請轉至下面的博客：
JSON詳解
當然也可以使用其他途徑來讀取和使用JSON，例如Python等，這個需要我們共同的去學習。
回到頂部3.3 XML和JSON對比
引用網友的一句話，“JSON和XML就像武林界的屠龍刀和倚天劍，那麽他們孰強孰弱？” 那麽大家一定也很想知道，誰才是武林的霸主？下面我們就一起將他們進行一下PK吧。
(1).可讀性方面：JSON和XML的數據可讀性基本相同，JSON和XML的可讀性可謂不相上下，一邊是建議的語法，一邊是規範的標簽形式，XML可讀性較好些。
(2).可擴展性方面：XML天生有很好的擴展性，JSON當然也有，沒有什麽是XML能擴展，JSON不能的。
(3).編碼難度方面：XML有豐富的編碼工具，比如Dom4j、JDom等，JSON也有json.org提供的工具，但是JSON的編碼明顯比XML容易許多，即使不借助工具也能寫出JSON的代碼，可是要寫好XML就不太容易了。
(4).解碼難度方面：XML的解析得考慮子節點父節點，讓人頭昏眼花，而JSON的解析難度幾乎為0。這一點XML輸的真是沒話說。
(5).流行度方面：XML已經被業界廣泛的使用，而JSON才剛剛開始，但是在Ajax這個特定的領域，未來的發展一定是XML讓位於JSON。到時Ajax應該變成Ajaj(Asynchronous Javascript and JSON)了。
(6).解析手段方面：JSON和XML同樣擁有豐富的解析手段。
(7).數據體積方面：JSON相對於XML來講，數據的體積小，傳遞的速度更快些。
(8).數據交互方面：JSON與JavaScript的交互更加方便，更容易解析處理，更好的數據交互。
(9).數據描述方面：SON對數據的描述性比XML較差。
(10).傳輸速度方面：JSON的速度要遠遠快於XML。
為了突出展示一下兩者的對比，舉一個經典的例子：
用XML表示中國部分省市數據如下：
<?xml version="1.0" encoding="utf-8"?>
<country>
<name>中國</name>
<province>
<name>黑龍江</name>
<cities>
<city>哈爾濱</city>
<city>大慶</city>
</cities>
</province>
<province>
<name>廣東</name>
<cities>
<city>廣州</city>
<city>深圳</city>
<city>珠海</city>
</cities>
</province>
<province>
<name>臺灣</name>
<cities>
<city>臺北</city>
<city>高雄</city>
</cities>
</province>
<province>
<name>新疆</name>
<cities>
<city>烏魯木齊</city>
</cities>
</province>
</country>
用JSON表示：
{
"name":"中國",
"province":[
{
"name":"黑龍江",
"cities":{
"city":["哈爾濱","大慶"]
}
},
{
"name":"廣東",
"cities":{
"city":["廣州","深圳","珠海"]
}
},
{
"name":"臺灣",
"cities":{
"city":["臺北","高雄"]
}
},
{
"name":"新疆",
"cities":{
"city":["烏魯木齊"]
}
}
]
}
講了這麽多，大家也肯定是淩亂了，不光是你們，就是我也記不住這麽多的內容。其實，總結一點就是：XML更像是數據傳輸界的長老，相對於JSON而言是一種重量型的數據交換格式；而JSON就是後起之秀，是一種輕量型的數據交換格式，兩個各有優缺點，孰輕孰重還要看具體的應用環境。
最後，向大家推薦兩個相關的博客：
1）JSON資料整理
2）JSON與XML的區別比較
HTML、XML和JSON學習匯總