0

現在、次のマークアップがあります。

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

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

そして、すべてのクラスを子 li から取得し、それらを特定の .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 クラスを取得する段階にあり、特定の .foo div ごとではなく、すべての .foo div に適用されます。

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

正しい方向への指針は大歓迎です。

4

3 に答える 3

3

要素を反復処理して.fooから、それぞれの子孫のクラスを取得する必要があります。

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

参照: each, map,get

.fooルックアップのため、遅い方法ですが、別の方法は次のとおりです。

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

参考：closest

于 2012-04-30T17:59:29.577 に答える
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 要素のタイプに関係なく、すべての要素に対して機能するはずです。

于 2012-04-30T18:09:55.860 に答える
0 
  $('.foo').addClass(function() {
    var cls = '';
    $('li', this).each(function() {
        cls += this.className.concat(' ');
    });
    return cls;
  });

デモ

于 2012-04-30T18:10:37.883 に答える