外部ライブラリを使用しない JavaScript からの JSONP リクエストの作成

JavaScript でのクロスドメイン JSONP リクエストの場合、jQuery などの外部ライブラリは必ずしも必要ではありません。純粋な JavaScript を使用してこれを実現するためのガイドは次のとおりです。

ステップ 1: コールバック関数を作成する

まず、JSONP 応答を受信して​​処理するコールバック関数を定義します。提供されている例では、 foo 関数は次のタスクを実行します。

function foo(data) {
  // Do something with the JSON response here
}

ステップ 2: スクリプト要素を動的に作成する

次に、

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo';

ステップ 3: スクリプト要素を DOM に追加する

document.getElementsByTagName('head')[0].appendChild(script);

最新のブラウザの場合、この行を次のように簡略化できます。 &&&]

document.head.appendChild(script);

function foo(data) {
  // JSON を使って何かを行う
}

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo'

document.head.appendChild(script);