イベントの扱い方その２（イベントが発生したオブジェクトを扱う方法）

jQuery イベントの扱い方

次は、イベントが発生した要素自身を取得したい場合。
例えばアレだ。

DBのテーブルに登録したレコードを編集するような「一覧画面」と「詳細画面」の関係。
一覧画面であるレコードをclickしたらその情報を詳細画面に表示するというイベント。
各レコードごとにイベントを登録するなんていうアホな真似はできない。
でもクリックするレコードは不定だ。

上述のレベルの複雑なタグを作るのは、今やっている学習の本質から外れてしまうのでもっとシンプルな構造でエッセンスだけ確認してみよう。
（今は「jQueryを使えるようになる」のが目的なので、できるだけ早く広く浅く把握する方が優先される。）

<html>
  <head>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">google.load("jquery", "1.3.2");</script>
    <script type="text/javascript">
      $(function() {
        $(".divClass").click(function(){
          $(this).css("font-weight", "700").css("font-size", "20pt");
        })
      })
    </script>
  </head>
  <body>
    <div class="divClass" style="color: red;">ぱんぱかぱんつ</div>
    <div class="divClass" style="color: blue;">ぱんぱかぱんつ</div>
    <div class="divClass" style="color: green;">すてきなぱんつで</div>
    <div style="color: black;">ぱんぱかぱんつ</div>
  </body>
</html>

うむ。クリックしたタグだけを扱うことができてますな。