Ajaxライブラリの「jQuery」。

jQueryの命令の1つで、セレクターで指定した要素内のテキストを書き換えるload()をご紹介します。

まず、Ajaxの注意点がいくつかあるので、確認しましょう。

  • 文字コードは基本的にはutf-8を推奨
  • セキュリティの問題で、同一ドメインのファイルしか読み込めない

今回はボタンを押すとサイドバーのプロフィールの文章を表示するスクリプトを書いてみました。

ここにサイドバーのプロフィールテキストを読み込みます。

ソースです。

このソースの前に、jQueryをheadタグ内に読み込ませて下さい。

<script type="text/javascript">
	$(function(){
		$("#load button").click(function(){
			$("#load div").load("http://blog.doubleside-web.jp/ p#side-face-text");
		});
	})
</script>
<div id="load">
	<button>読み込みボタン</button>
	<div><p>ここにサイドバーのプロフィールテキストを読み込みます。</p></div>
</div>