3

次の CSS を jQuery に置き換える方法はありますか?

.quote-body .quote-body { background: #f5f5f5 }
.quote-body .quote-body .quote-body { background: #fff }
.quote-body .quote-body .quote-body .quote-body { background: #f5f5f5 }
.quote-body .quote-body .quote-body .quote-body .quote-body { background: #fff }
...
and so on
4

2 に答える 2

5

このようなものがうまくいくかもしれません：

$('.quote-body').each(function() {
    $(this).addClass($(this).parents('.quote-body').size() % 2 ? 'odd' : 'even');
});

すべての .quotebody 要素について、クラス .quotebody を持つ親要素の数を見つけ、奇数または偶数を定義するために 2 の法を取ります。

編集

テスト済みで美しく動作します。このメソッドは、すべての要素について、jQuery がルート要素までずっとトラバースする必要があるため、複雑なドキュメントでは少し遅くなる可能性があります。しかし、それは機能します。

作業例: http://www.ulmanen.fi/stuff/oddevenchild.php

于 2009-12-11T22:44:06.023 に答える
0

これを解決できる単純なセレクターは考えられませんが、while ループを使用して意図した結果を達成できる可能性があります。

var $quotes = $(<containing-elem>).children(".quote-body"), level = 0;

while($quotes.length > 0) {
    $quotes.css("background-color", (level % 2 ? "#f5f5f5" : "#fff"));
    level += 1;
    $quotes = $quotes.children(".quote-body");
}

最初に選択する要素が多すぎないようにするために、最初に、包含要素の直接の子である要素を.quote-body選択しています。.quote-body

于 2009-12-11T22:45:19.063 に答える