Google Hosted Libraries - Developer's Guide - jQueryを使えるようにする

このエントリーをはてなブックマークに追加

20131125210235_blogpix.png

jQueryを使う方法としては公式サイトからダウンロードして来てサーバーにアップロードする方法がオーソドックスなやり方だと思いますが、その他にGoogle等がホストしているライブラリーから使う方法があります。

使い方は簡単です。

  1. 下記ページにアクセスします。
    https://developers.google.com/speed/libraries/devguide
  2. 「Available Libraries」のリストからjQueryを選びます。
    20131125203556_blogpix.png
  3. 「snippet」の緑の文字のところをコピーして、jQueryを読み込ませたいページの<head>の中にペースとします。
    これでjQueryは使えるようになります。
  4. そして、コピーした<script>タグのsrc属性のURLに「1.10.2」という数字が含まれています。これは、読み込むjQueryのバージョンのようなので、ここを書き換えることで読み込むjQueryのバージョンを帰ることが出来ます。
  5. 使用可能なjQueryのバージョンは「versions」の数字のところにカーソールを持っていくと表示されます。ここから、読み込みたいバージョンの数字でsrc属性のURL内の数字を書き換えます。

バージョンの数字だけを書き換えれば新しいバージョンのjQueryを使えるのは便利ですね。

それに、新しいバージョンのjQueryがリリースされたときも、バージョンの部分だけ書き換えてテストが出来るので、そう言った点でも便利ですね。

まぁ、自分でダウンロードしたjQueryを使う場合も本番で使うjQueryのファイルをjquery.jsなどに固定しておけば、差し替えは簡単なのでこの点はそれほどアドバンテージはないのかもしれませんが...。

あまりないかもしれませんが、ページごとやディレクトリごとに違うバージョンのjQueryを使わなければいけない場合などはこのようにホストされたものを使う方が、未使用だと勘違いして間違ってサーバーからjQueryのファイルを削除してしまうなどは防げますね。

おまけですが、このGoogle Hosted Librariesにある<script>タグのsrc属性のURLはhttp:が省略されてますね。これって初めて見るけどプロトコル部分だからWEBサイトで使われていると判断されれば問題ないのかな?ブラウザ次第?気持ち悪いのでとりあえずhttp:も付けておきました。

このエントリーをはてなブックマークに追加