ifameで別サーバーのページにデータを渡して表示する

iframeを使い別サーバーにあるページを読み込み、また情報を渡してJavaScriptで情報を表示するコードです。

iframe.html

iframe.htmlは、ブラウザで表示するページで、読み込むURLの後に#とJSON形式（オブジェクト）のデータつけて情報を渡しています。

<body>
<iframe src='http://example.com/iframe_test.html#{"title":"TEST"}' width="300px" height="50px"></iframe>
</body>

iframe_test.html（別サーバー）

iframe.htmlに読み込まれる側のページで、受け取った情報をid=test内にテキストとして表示します。

<div id="test"></div>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(function() {
	var data = JSON.parse(location.hash.substring(1));
	$('#test').text(data.title);
});
</script>