n 번째 자식 셀렉터,

Question

바이올린 이상한 일이 여기에있다 - 여기 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)를 작성했습니다 위 class="b"의 두 번째 요소를 선택 하시겠습니까?

나는 color:red로 클래스 B2을 강조 싶지만 color:red로 클래스 B1을 얻고있다. 문제는 무엇입니까? 그게 어떻게 작동하는지 나에게 따르면이 선택기의 버그입니다.

바이올린은 내 문제하지만 내 진짜 문제에 나뿐만 아니라 nth-child(2)nth-child(j + 1) 같은 j 연극 다른 역할을 가지고있다이고 그것에게 j+2을 할 수없는 어떤 사람을 알려 단지입니다.

은 누구도 날이 해결 방법은 nth 아이를 선택합니다 클래스 B2

Answer 1

부터 시작이다. 위해 은 당신이 쓰는 것 B2 얻을 : :nth-child(2)가 두 번째 아이를 선택하지 않는 이유를 원래의 질문에 대한

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

업데이트

, 나는 이유를 발견했다. jQuery docs site에 나는 발견 두 극적으로 다른 유사한 요소를 초래할 수 에도 불구하고 식 (N) :

: n 번째 자식 (N) 유사 클래스와 혼동하기 쉬운 것이다. : nth-child (n)을 사용하면 에 관계없이 모든 하위 항목이 계산되고, 의사 클래스에 연결된 선택기와 일치하는 경우에만 지정된 요소가 선택됩니다. 다음과 같이 : eq (n) 의사 클래스에 연결된 셀렉터 만 카운트되며 다른 요소의 자식에 국한되지 않고 (n + 1) 번째 (n은 0 기반)가 선택됩니다.귀하의 경우 그래서

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

:nth-child(2) 카운트에게 .parent의 어린이와 요소가 jQuery를`n 번째 child`은 CSS 사양에서 파생 .b

Answer 2

:nth-child()을 강조 알려 주시기 바랍니다 수 있습니다. 따라서 2를 지정하면 두 번째가됩니다. 3 번째를 원할 경우 3을 지정하십시오.

예제도 참조하십시오. 당신이 그것을 j+2 할 수없는 이유를

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

이해가 안 돼요. n 번째의 아이를위한 JQuery와 문서의 인덱스로

Answer 3

왜 대신 :nth-child(2)의 :eq(2)를 사용하지 않는 제로가 아닌 based.it 1.