JSONPファイルのデータをJavaScriptを利用して表示する

jQuery・JS

JSONP形式のデータをJavaScriptで利用するときの例。

JSONPは、下のコード(jsonp.js)にあるようにJSON形式のデータ({key:value})をさらに関数の呼び出しで囲ったスタイルになります。なので、この関数を実行すると定義された関数が呼び出されて値を渡して実行することになります。

jsonp.js

mycallback({
		"title": "jsonp",
		"description": "jsonp test"
})

jsonp.html

jsonp.htmlにあるscriptタグでjsonp.jsを読み込むと、jsonp.jsファイルにあるmycallback(呼び出し)が実行され、jsonp.htmlにあるmycallback(jsonp)が呼び出され引数jsonpに値が渡されて、関数の中でデータを処理してブラウザに表示します。

function mycallback(jsonp) {
	var data = jsonp.title;
	document.write(data);
}
<script src="jsonp.js"></script>
スポンサーリンク

コメント

タイトルとURLをコピーしました