HOME > > > > >

.class

クラス名が.classの要素を取得します。

サンプル

実行結果

Javascript

  1. $('.jqTest').click(function(e){
  2.     if ($(e.target).attr('class') === 'select_zaku') {
  3.         $('.zaku').css({backgroundColor: '#FFFAC6'});
  4.     } else if ($(e.target).attr('class') === 'select_caquu') {
  5.         $('.caquu').css({backgroundColor: '#9FB7D4'});
  6.     }
  7. });

HTML

  1. <div class="jqTest">
  2.     <ul>
  3.         <li class="caquu"><a href="http://www.caquu.com/tools/">Tools</a></li>
  4.         <li class="zaku"><a href="http://www.zaku055.com/category/int/">インテリア</a></li>
  5.         <li class="caquu"><a href="http://www.caquu.com/notcc/site/findbrushes/">notCC</a></li>
  6.         <li class="zaku"><a href="http://www.zaku055.com/category/book/">BOOK</a></li>
  7.     </ul>
  8.  
  9.     <dl>
  10.         <dt class="caquu">www.caquu.com</dt>
  11.         <dd class="caquu"><a href="http://www.caquu.com/elements/">Elements</a></dd>
  12.     </dl>
  13.  
  14.     <div class="zaku">
  15.        <ul>
  16.        <li><a href="http://www.zaku055.com/category/game/">ゲーム</a></li>
  17.        <li><a href="http://www.zaku055.com/category/products/">プロダクト</a></li>
  18.        </li>
  19.     </div>
  20.  
  21.     <button class="select_zaku">.zaku</button><button class="select_caquu">.caquu</button>
  22. </div>