1. 程式人生 > >JSON、JSONP、XML的區別

JSON、JSONP、XML的區別

call for site ticket 域名 容易 沒有 weekend 遍歷

這兩天看jquery手冊的時候看到了jsonp。發現手冊把jsonp與json放在一起講解了,所以想寫篇文章 梳理一下這三者的關系。

jsonp:

jsonp是json的一種“使用模式”,可以讓網頁從別的域名(網站)獲取資料,即跨域讀取數據。

因為同源策略所以當我們從不同的域訪問數據時需要使用jsonp。同源策略是瀏覽器的安全功能。

jsonp的核心則是動態的添加<script>標簽來調用服務器的js腳本。

看jsonp.html頁面的代碼:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
    // 得到航班信息查詢結果後的回調函數
    var flightHandler = function(data){
        alert(‘你查詢的航班結果是:票價 ‘ + data.price + ‘ 元,‘ + ‘余票 ‘ + data.tickets + ‘ 張。‘);
    };
    // 提供jsonp服務的url地址(不管是什麽類型的地址,最終生成的返回值都是一段javascript代碼)
    var url = "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998&callback=flightHandler";
    // 創建script標簽,設置其屬性
    var script = document.createElement(‘script‘);
    script.setAttribute(‘src‘, url);
    // 把script標簽加入head,此時調用開始
    document.getElementsByTagName(‘head‘)[0].appendChild(script);
    </script>
</head>
<body>
 
</body>
</html>

json:

json 是javascript對象表示法

json是輕量級的數據交換格式

json是獨立於語音的

json具有自我描述性,更容易理解

json文本格式在語法上於創建JavaScript對象的代碼是相同的,無需解釋,JavaScript程序能夠使用內建的eval()函數,用json數據生成原生的JavaScript對象。

json語法是JavaScript的對象表示法語法的子集

語法規則:

  • 數據在名稱/值對中
  • 數據由逗號分隔
  • 大括號保存對象
  • 中括號保存數組
{
"sites": [
{ "name":"菜鳥教程" , "url":"www.runoob.com" }, 
{ 
"name":"google" , "url":"www.google.com" }, { "name":"微博" , "url":"www.weibo.com" } ] }

XML:

XML是可擴展標記語言。是一門語言。XML被設計用來傳輸和存儲數據。

  • XML 指可擴展標記語言(EXtensible Markup Language)。
  • XML 是一種很像HTML的標記語言。
  • XML 的設計宗旨是傳輸數據,而不是顯示數據。
  • XML 標簽沒有被預定義。您需要自行定義標簽。
  • XML 被設計為具有自我描述性。
  • XML 是 W3C 的推薦標準。
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don‘t forget me this weekend!</body>
</note>

JSON與XML相同之處:

  • JSON 是純文本
  • JSON 具有"自我描述性"(人類可讀)
  • JSON 具有層級結構(值中存在值)
  • JSON 可通過 JavaScript 進行解析
  • JSON 數據可使用 AJAX 進行傳輸

與 XML 不同之處

  • 沒有結束標簽
  • 更短
  • 讀寫的速度更快
  • 能夠使用內建的 JavaScript eval() 方法進行解析
  • 使用數組
  • 不使用保留字

為什麽使用 JSON?

對於 AJAX 應用程序來說,JSON 比 XML 更快更易使用:

使用 XML

  • 讀取 XML 文檔
  • 使用 XML DOM 來循環遍歷文檔
  • 讀取值並存儲在變量中

使用 JSON

  • 讀取 JSON 字符串
  • 用 eval() 處理 JSON 字符串

JSON、JSONP、XML的區別