jQuery 01-07: jQueryの短縮構文

●jQueryを$で置き換える

一章の最後に、jQueryの短縮構文を学びます。
これまで、通常のjavaScriptと区別しやすいようにjQueryと明示的に書いてきましたが
実はこれは「$」で置き換えることが可能です。

sample : jQueryを$で置き換える
 
 jQuery(“a”).attr(“target”,”_blank”);
  ↓
  $(“a”).attr(“target”,”_blank”);

 
http://www.designdrill.jp/jquery/01/step14.html
サンプルのstep14.htmlを開きソースを確認してください。jQueryが$になっていても正常に
機能することが確認できます。これはjQueryのソースを短くするのに大変便利ですが、
初めのうちはjQueryの機能を利用している事を意識できるようにjQueryと明示的に書くのも
良いと思います。

 
 

●readyイベントの短縮構文

jQueryでは必ずreadyのイベントハンドラが必要になってきます。ですのでreadyには以下の
様な短縮構文が用意されています。これを利用すれば書く量を大幅に減らすことできるので
大変便利ですが、最初のうちはreadyイベントを意識できるように短縮しないで書くのも
良いと思います。

sample : readyイベントハンドラの短縮構文
 
 jQuery(document).ready(function () {
  ↓
  $(function () {

 
http://www.designdrill.jp/jquery/01/step15.html 
step15.htmlを開いてソースを確認してください。上記のように短縮して書いても
正常に機能することを確認できます。
 
 
次回から2章に入ります。2章ではready以外のイベント(主にクリック)と
アニメについて説明する予定です。
 
 
 

3 Responses to jQuery 01-07: jQueryの短縮構文

    • jQueryを始める前はcss3やhtml5にあまりモチベーションが
      上がらなかったのですが、jQueryを切っ掛けにモチベーションが
      上がりました。css3&html5でjQueryの表現の幅も増えますから。
       

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


8 × 六 =


*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>