HOME > > > > >

.removeClass()

.removeClass( [className] )

引数

(String)className
削除するclass属性の値。指定しない場合全て削除

戻り値

jQuery
jQueryオブジェクト

サンプル

jQueryオブジェクトが持つDOM要素のclass属性を削除する。

実行結果

  • class="removeClass"
  • class="test"
  • class="firstClass secondClass"

removeClass()実行後

Javascript

  1. var has_classname = '';
  2. $('.jqTest1 li').removeClass().each(function(){
  3.     has_classname += $.isEmptyObject($(this).attr('class')) ? 'empty<br />' : $(this).attr('class') + '<br />';
  4. }).closest('.jqTest1').append(has_classname);

HTML

  1. <div class="jqTest1">
  2.     <ul>
  3.     <li class="removeClass">class="removeClass"</li>
  4.     <li class="test">class="test"</li>
  5.     <li class="firstClass secondClass">class="firstClass secondClass"</li>
  6.     </ul>
  7.     <hr />
  8.     <h5 class="headline-output">removeClass()実行後</h5>
  9. </div>

.removeClass( function(index, class) )

引数

(int) index
対象DOMのjQuerryオブジェクト内でのインデックス
(string) class
対象DOMの現在のクラス

戻り値

jQuery
jQueryオブジェクト

サンプル

functionで戻した値が削除対象のクラス名となる。

実行結果

  • class="even odd"
  • class="even odd"
  • class="even odd"
  • class="even odd"

removeClass()実行後

Javascript

  1. var has_classname2 = '';
  2.  
  3. $('.jqTest2 li').removeClass(function(i, classname){
  4.     if (i % 2) {
  5.         return 'even';
  6.     } else {
  7.         return 'odd';
  8.     }
  9. }).each(function(){
  10.     has_classname2 += $(this).attr('class') + '<br />';
  11. }).closest('.jqTest2').append(has_classname2);

HTML

  1. <div class="jqTest2">
  2.     <ul>
  3.     <li class="even odd">class="even odd"</li>
  4.     <li class="even odd">class="even odd"</li>
  5.     <li class="even odd">class="even odd"</li>
  6.     <li class="even odd">class="even odd"</li>
  7.     </ul>
  8.     <hr />
  9.     <p>removeClass()実行後</p>
  10. </div>