0

フィドルはここにあります-http://jsfiddle.net/ashwyn/a45ha/

ここにHTML-

<div class="parent">
    <div class="a">Class A</div>
    <div class="b">Class B1</div>
    <div class="b">Class B2</div>
    <div class="b">Class B3</div>
    <div class="b">Class B4</div>
    <div class="b">Class B5</div>
</div>​

ここにjquery-

$(function(){
    $(".parent").children(".b:nth-child(2)").css("color", "red");
});​

上記で書い.b:nth-child(2)たので、なぜ2番目の要素を選択できないのclass="b"ですか?

クラスB2をとして強調表示したいのですが、クラスB1をとしてcolor:red取得しています。問題の人は何ですか?それがどのように機能するかというと、私によれば、このタイプのセレクターのバグです。color:red

フィドルは、私の問題が何であるかをみんなに知らせることですが、私の本当の問題では、nth-child(2)他の役割も果たしているので、それを実現することはできませnth-child(j + 1)ん。jj+2

クラスB2を強調するための回避策を教えてください。

4

3 に答える 3

3

:eq(2)の代わりに使ってみませんか:nth-child(2)。B2を取得するには、次のように記述します。

$(".parent").children(".b:eq(1)").css("color", "red");

アップデート

:nth-child(2)なぜ2番目の子を選択しないのかという最初の質問に対して、私はその理由を見つけました。jQueryドキュメントサイトで私は見つけました:

:nth-​​child(n)疑似クラスは:eq(n)と簡単に混同されますが、2つは劇的に異なる一致要素をもたらす可能性があります。 :nth-​​child(n)を使用すると、子が何であるかに関係なく、すべての子がカウントされ、指定された要素は、疑似クラスにアタッチされたセレクターと一致する場合にのみ選択されます。:eq(n)を使用すると、疑似クラスにアタッチされたセレクターのみがカウントされ、他の要素の子に限定されず、(n + 1)番目のセレクター(nは0ベース)が選択されます。

だからあなたの場合

$(".parent").children(".b:nth-child(2)").css("color", "red");

:nth-child(2)子をカウントし.parent、要素が.b

于 2012-06-15T05:58:45.983 に答える
0

:nth-child()子を選択しますnth。したがって、2を指定すると、2番目になります。3番目が必要な場合は、3を指定します。

彼らの例も見てください。

$("ul li:nth-child(2)")
John
Karl - 2nd!
Brandon

なぜできないのかわかりませんj+2

于 2012-06-15T05:55:37.147 に答える
0

n番目の子のjqueryドキュメントインデックスはゼロベースではないため、1から始まります。

于 2012-06-15T05:56:21.223 に答える