http://www.google.com/jsapiを使用してjQueryをロードするときの注意点

2012年2月10日

http://www.google.com/jsapiを使用した、jQueryのロード


以下の記述で、googleがホスティングしているjQueryを利用することが出来る。

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
	google.load("jquery", "1.4");
 	google.load("jqueryui", "1.7");
</script>



バージョン指定のルール

google.load(“jquery”, “1”);だと1.x.xの最新版が自動で取得できるし、google.load(“jquery”, “1.4.x”);の最新になる。
もちろん、google.load(“jquery”, “1.4.2”);といった感じで、バージョンを完全指定することも可。


ライブラリがロードされるタイミング

google.load()はページがロードされたとき(onLoad)のタイミングで実行してくれる。
なので、画面が表示されるまでの遅延は極力抑えられる。

一方で、ページのロード時にこれらのライブラリを利用したい場合は注意が必要。
他の部分でjQueryを使用したくても、jQueryオブジェクト「$」が存在せずエラーになってしまう。


この問題を回避するために、該当のライブラリがロードされてから処理を行いたい場合は、第三引数にコールバック処理を書くと良い。

function onLoadedJQuery() {
	$( "#someId" )...; // jQueryオブジェクトを使った処理
}
 
google.load("jquery", "1.4", {"callback" : onLoadedJQuery});


関連記事
同じカテゴリの記事はこちらから!! → JavaScript タグ:

コメントを残す

メールアドレスが公開されることはありません。