1

そのようにhtmlレイアウトを作成する場合

<ul>
     <li class='a'></li>
     <li class='b'></li>
     <li class='a'></li>
     <li class='b'></li>
     <li class='a'></li>
     <li class='b'></li>
     <li class='a'></li>
     <li class='b'></li>
</ul>

$$('.a:odd') のように 'a' クラスで奇数要素を選択しようとすると、空の配列が得られます。 $$('.a:even') を実行すると、4 つの li 要素すべてが得られます。 「a」クラスで..それは本当に奇妙です..しかし、私はmootoolsに慣れていないので、何か間違ったことをしているのかもしれません..

だから私の質問は、クラスで1番目と3番目のli要素を選択する方法です。私はこのような関数でそれを行うことができることを知っています

$$('.a').filter(function(item, index) { return index%2; }

しかし、奇数要素または偶数要素を選択するような小さなタスクには複雑すぎます..

4

4 に答える 4

2

問題は、:odd と :even (およびそれらの CSS いとこである :nth-child(odd) と :nth-child(even)) が、要素が親の子としてではなく、親の子として表示される順序を参照することです。特定のセレクター。

これは私にとってはうまくいきました（プロトタイプですが、MooToolsには同様の構文があるようです）：

var odd = $$('.a').filter(function(item, index) {
    return index % 2 == 0;
});
var even = $$('.a').filter(function(item, index) {
    return index % 2 == 1;
});

編集：あなたは質問でそれをすでにカバーしているようです。完全に読む前に答えてくれてありがとう。

于 2009-01-26T02:04:32.257 に答える
0

:nth-child 擬似セレクターは、選択された (一致する) 要素内ではなく、DOM 要素(ゼロ以外のインデックス) の indexを調べます。MooTools は、':odd'セレクターを追加して、'real' 奇数要素を選択するようにしたため、インデックスは 0 から始まります。

したがって、あなたの例では、インデックスが 1 から始まるため、「.a:nth-child(odd)」を選択するとすべての li.a 要素が返されます。「.a:odd」を選択すると、「実際の」奇数がないため、何も選択されませんli.a要素。

おそらく必要なのは、「:nth-of-type」要素を選択することです。したがって、「.a:nth-of-type(odd)」を選択すると、すべての奇数の li.a 要素が返されます (1 番目と 3 番目の要素 - DOM 要素のインデックスを使用します)。

MooTools はデフォルトで「:nth-of-type」セレクターをサポートしていませんが、Selectors.Pseudo クラスを使用してセレクター エンジンを拡張できます (現在、例を見つけることができません)。

于 2009-05-15T19:14:29.287 に答える
0

1 番目と 3 番目を取得しようとしている場合は、必要なのは $$('.a') だけです。

1番目と5番目のアイテムを取得しようとしていますか? それは $$('a:nth-child(4n+1)) のようなものになります

mootools はcss3 構造疑似クラスを使用すると想定しています

于 2009-01-26T02:00:46.337 に答える
-1

まぶたがないからバグじゃないって？それはそれが機能する方法ですか？

于 2009-01-26T02:16:24.167 に答える