JavaScript/處理 JSON

處理 HTML

處理 XML

處理 HTML

處理 XML

原生 JSON

現代 JSON 處理

處理 JSON 可能需要新增一個支援庫，它建立全域性 JSON 物件。此物件僅在新瀏覽器（例如 FF 3.5、IE8）中才原生存在。可以在此處找到此類庫。

//Parsing JSON:
var myObject = JSON.parse(myJSONtext)

//Creating JSON:
var myJSONText = JSON.stringify(myObject);

舊方法

在舊瀏覽器中，您可以使用以下語法，但這會引發安全問題，例如 XSS。

var myObject = eval("(" + myJSONtext + ")")

JSONP

維基百科在 JSONP 上有相關資訊。

鑑於瀏覽器對跨域 Ajax 的限制（在某些早期瀏覽器中僅透過配置允許，在 IE8 中透過非標準方式允許，並在 HTML5 中透過伺服器標頭允許），繞過這些限制的一種方法（同時仍然需要一些伺服器端指令碼協調）是讓網站動態地在他們的程式碼中插入一個 HTML 指令碼標籤，從而他們目標的跨域指令碼（通常）提供 JSON，但包裝在函式呼叫中（函式名稱根據請求者提供的“回撥”引數的值來提供）或其他可執行程式碼。

在 PHP 中，您可以像這樣簡單地提供 JSONP

<?php
if (isset($_GET['callback'])) {
  header('Content-Type: application/javascript');
  $our_site_data = ... // Set to an array or object containing data to be supplied for use at other sites
  print $_GET['callback'] . '(' . json_encode($our_site_data) . ')';
}
?>

jQuery 和其他框架有自己的生成 JSONP 請求的方法，但我們將使用以下自定義程式碼。

注意：重要的是要記住，如果目標站點或目標站點提供的資料可能來自不可信來源，則不應使用以下程式碼，因為此類指令碼可能以使用站點的許可權（例如，讀取使用者 cookie 並將它們傳遞到另一個站點）執行，從而執行跨站點指令碼攻擊。

<script>
var JSONP = function(global) { // Introduces only one global
  // MIT Style license, adapted from http://devpro.it/code/209.html
  function JSONP(uri, callback) {
    function JSONPResponse() {
      // Reduce memory by deleting callbacks when finished
      try { delete JSONP[src] } catch(e) { JSONP[src] = null; }
      documentElement.removeChild(script);
      // Execute the user's callback with the arguments supplied by the server's JSONP call
      if (typeof callback === 'string') { // Assumes only one return argument and that it is an HTML string
        document.getElementById(callback).innerHTML = arguments[0];
      } else {
        callback.apply(this, arguments);
      }
    }
    // Ensure a unique callback
    var src = '_' + id++,
    script = document.createElement("script");
    // Add our callback as a property of this JSONP
    // function to avoid introducing more globals
    JSONP[src] = JSONPResponse;
    // We include "callback", as it is typically used in
    // JSONP (e.g., on Wikibooks' API) to specify the callback
    documentElement.insertBefore(
      script,
      documentElement.lastChild
    ).src = uri + (uri.indexOf('?') === -1 ? '?' : '&') + "callback=JSONP." + src;
  }
  var id = 0, documentElement = document.documentElement;
  return JSONP;
}(this);

// Get the parsed HTML of this page you are reading now
// using the Mediawiki API (See https://wikibook.tw/w/api.php
// for Wikibooks, but it also applies at other Mediawiki wikis) that
// allows for such cross-domain calls
JSONP('https://wikibook.tw/w/api.php?action=parse&format=json&page=JavaScript/Handling_JSON',
  function (data) {
    alert(data.parse.text['*']);
  }
);
</script>

原生 JSON

現代 JSON 處理

舊方法

JSONP

更多資訊