2012-04-30 22 views
0

にすべての子クラスを適用します。 FOO:は、私は現在、次のマークアップを持つ親要素

<div class="foo a b"> 
    <ul class="bar"> 
    <li class="a"></li> 
    <li class="b"></li> 
    </ul> 
</div> 

<div class="foo c d"> 
    <ul class="bar"> 
    <li class="c"></li> 
    <li class="d"></li> 
    </ul> 
</div> 

は、これまでのところ私は以下のものを持っているが、それは最初のliクラスを取得する段階でのみだと、それは、それぞれ特定の1とは対照的に、全ての.fooというdiv要素に適用します。

$(".foo").addClass($('.bar li').attr('class')); 

正しい方向のポインタは大歓迎です。

$('.foo').each(function() { 
    $(this).addClass($(this).find('.bar li').map(function() { 
     return this.className; 
    }).get().join(' ')); 
}); 

リファレンスeachmapget

他、しかしあなたはそれぞれの子孫のそれぞれのクラスを取得し、その後.foo要素を超える反復に必要と

+1

私は自分のオリジナルのCSSを変更するのではなく、頼むかもしれませんか? – Blazemonger

答えて

3

遅い方法は、.fooルックアップのため、

$('.bar li').each(function() { 
    $(this).closest('.foo').addClass(this.className); 
}); 

リファレンス:ここclosest

+0

素晴らしいです、ありがとうございます。私はちょうど反復の部分に入っていたし、周りに迷っていたし、あなたはそれを完全に表現しました。 –

+0

あなたは大歓迎です:) –

0

はあなたが何をする必要があるかないいくつかのコードです:

$('.foo').each(function(i, elem) { 
    get_child_classes(this,elem); 
}); 

//the function you need 
function get_child_classes (parent,current){ 
    $(current).each(function(i, elem) { 
     $(elem).children().each(function(j, elem1){ 
      $(parent).addClass($(elem1).attr('class')); 
      get_child_classes (parent, elem1); 
     }); 
    }); 
} 

はここにフィドルを参照してください。http://jsfiddle.net/Zpx8R/ このコードは、すべての要素のために働く必要があり、それがどんなタイプのHTML要素であっても。あなたが動的にこれをしたい理由

0
$('.foo').addClass(function() { 
    var cls = ''; 
    $('li', this).each(function() { 
     cls += this.className.concat(' '); 
    }); 
    return cls; 
    }); 

DEMO

関連する問題