4

わかりました。IE 8 でサポートされていないことはわかっnth-child([:even|:odd])ています。そのため、奇数/偶数行に等しいクラスを適用する方法を考え出そうとしています。私が使用する方法:nth-child。私の方法はうまくいくと思いますが、順序付けされていないリストがあり、その中に複数のサブ順序付けられていないリストがあるため、ゼロインデックスはこの問題の影響を受けているようで、正しく適用されません

問題をよりよく示すために、何が起こっているのかを示すjsFiddleの例があります。たとえば、「ヘッダー 1」と「ヘッダー 2」を持つ LI の例は同じレベルですが、どちらも「偶数」クラスを取得します。

目標は、各 UL がゼブラ スタイルをその子に 1 レベルの深さで適用し、後続の各 UL とその子が同じことを行うことです。これを修正する方法について誰かが私に骨を投げることができますか? 現在、ULごとではなく、全体的なDOMインデックスに基づいているようです(それが理にかなっている場合)。

4

2 に答える 2

2

このようなもの?

$('ul > li:nth-child(odd)').addClass('li_odds');
$('ul > li:nth-child(even)').addClass('li_evens');    

jsFiddle の例

于 2013-03-28T19:11:48.970 に答える
1

この問題は、「アイテムの直接の子孫であるul > liすべてのアイテムを検索する」ことを意味するcss 構文の小さな誤解に起因することに注意する価値があると思います。選択されたアイテムのリストには、すべての外側の要素と内側の要素が含まれます。このため、 jqueryが偶数または奇数 ( ) でフィルタリングするように要求された場合、フィルタリングされるリストは意図したよりも大きく、DOM 階層の複数のレベルからのアイテムが含まれているため、複数のストライピングが発生します。 ul ベースではなく、階層のレベル。liulul.filter(':odd|:even')

$('ul > li:nth-child(odd|even)')、css の選択をゼブラ ストライプを作成するリストに限定することでこれを修正します。これが IE8 でも機能する理由は、jquery がネイティブ css ではなく選択を処理しており、jquery が IE8 の制限を回避しているためです。

于 2013-03-28T19:37:38.407 に答える