おまじない・・・jQueryのお約束

さっそくですが、jQueryを使うときは自分で処理を記述するにしても、プラグインを使うにしても、まずjQueryライブラリを読み込む必要があります。
jQueryは「jQueryを使うための準備」で説明した通り、javascriptなので、jQueryライブラリをwebページに読み込むときは、scriptタグを使います。

いつものjsファイルを読み込むときと同様に、src属性に正しいパスを記述して、読み込んでおいてください。

jQueryはjsなので、もちろんjQueryで何かしら処理を記述して外部ファイルにするときは拡張子は[.js]になります。

では、jQueryで処理を記述するときのおまじないについて説明します。
自分で処理を記述するのではなく、プラグインを利用する場合でも、何かしらパラメーターを指定しなければならなかったりするので、このおまじないとは無縁ではいられません。


jQueryのおまじない1

$(function(){
    //ここにスクリプト
})

※黒い部分をダブルクリックするとソースを選択できるので、コピーして使ってください。

jQueryのコード(スクリプト・関数etc.)を記述するときは、とにかくこれで囲ってください。
何故と考えなくても良いです。どうしても知りたい場合は、google先生にお願いしてください。解説書籍とかにも書いてます。

$(document).ready(function(){
    //ここにスクリプト
})

こんな風にしている人もいます。ほかにもいろいろあります。どれでもよいです。
あとはprototypeとかmootoolsとか、他のjsライブラリと共存したいときは、別な書き方をする場合もあります。
詳しくはgoogle先生に訊いてください。

このおまじない1やおまじない2の中にはjqueryのコードだけではなく、通常のjsコードも記述できます。


jQueryのおまじない2

$(window).load(function(){
    //ここにスクリプト
})

※黒い部分をダブルクリックするとソースを選択できるので、コピーして使ってください。

ページを読み込み後に実行させたいjQueryはこれで囲みます。

jQueryのコードを書き込んだり、jsファイルを読み込んだりするのは、たいていheadタグ内だと思います。
ブラウザはHTMLソースの上から順に実行(表示)していくので、当然、headタグ内のjQueryはbodyタグの表示前に実行されるわけです。
しかし、場合によっては、ページの表示がすんでから、実行したい必要があります。

その場合はこのおまじないを使ってください。

もちろん、bodyの終了タグ直前辺りにscriptタグを持ってきて、jQueryを書き込んだり、ファイルを読み込んだりしても良いです(この場合はおまじない1の書き方でおけー)。
headタグ内に収めたい場合におまじない2を活用してください。

通常、jsはbodyの終了タグ直前に記述した方が、webページ全体の表示速度は上がるようです。しかし、表示されるより先にjs(jquery)を実行しておかなければならないこともあるので、jsをどこに記述するかは、目的に合わせて選択してください。


jQueryのおまじない3

$(function(){
    $('セレクター').jQueryの命令というかなんとゆーか;
})

jQueryの処理を記述するときの基本的な書き方です(「jQueryの命令」と言い切ってしまうと語弊があるので濁してますが・・・ここではドットより前が大事です)。

セレクターというのは、htmlのどの要素に対してjQueryを実行するかを指定するものです(タグやclass名、id名などを指定します)。

セレクターとして指定するもので、thisやwiondowなどはクォーテーションで囲みません。これらについては、ここでは説明しません。

なにか抜けると、うまく動作してくれません。とくに'(")で囲むのを忘れがちです・・・。

$('')のシングルクォーテーションとダブルクォーテーション違いは特にないです。処理速度がどーのとか、エスケープシーケンスがどーのとか、世の中にはいろいろ情報が錯綜してますが、気にしなくていいです。
ただ、同じソース上は統一した方が良いとは思います。うっかり、ごちゃ混ぜになりますが・・・。

ちなみに、jQueryだけでなく、一般的なお約束として、クォーテーションの中にクォーテーションを書いて入れ子にしなければならない場合は、シングルの中にダブルとかダブルの中にシングルとか・・・クォーテーションが入れ子になるときは、違いを明確に使い分けます。シングルの中にシングルを書くということはできません。
もちろん、シングルの閉じはシングルだし、ダブルの閉じはダブルになるので、シングルで始まってダブルで終わるという使い方はエラーになります。
入れ子にすると、ごっちゃになってしまうので、特に注意しましょう。

戻る

Top