특정 하위 요소

Question

를 얻기 위해 I DOM에 다음과 같은 구조를 가지고 :

을 :

<div class="parent"> 
    <div class="child0"></div> 
    <div class="child1"></div> 
    <div class="child2"></div> 
    <div class="child3"></div> 
    <div class="child4"></div> 
    <div class="child5"></div> 
      ... 
</div> 

내가 자바 스크립트에서 수행하려고하는 특정 요소를 보여이 같은 다른 사람을 숨기는 것입니다

showItems(0,3,'.parent'); // show child 0,1,2 

    function showItems(offset,limit,component) 
    { 
     $(component).children().hide(); 
     for(var i=offset;i<=(offset+limit);i++) 
     { 
      $(component+':nth-child('+i+')').show(); //!!! does not make them visible 
     } 

    } 

어떤 아이디어가 있습니까?

감사합니다.

Answer 1

구성 요소와 : nth-child 사이에는 공백이 필요합니다. 왜냐하면 이제는 n 번째 자식 인 "parent"클래스가있는 요소를 선택하기 때문입니다.

Answer 2

당신은 그것을 쉽게와 같이, 대신 .eq() 방법을 사용한다 :

function showItems(offset,limit,component) 
{ 
    $(component).children().hide(); 
    for(var i=offset;i<=(offset+limit);i++) 
    { 
     $(component).children().eq(i).show(); //this will work! 
    } 

} 

Answer 3

그냥 당신이 선택 즉시 차일의 하나를 만들기 위해 '>'추가, Remco의에 의해 대답에 추가 .

그래서 한 가지 방법은 당신이 '>'기호를 배치하지 않는 경우이 경우

$(component+' > :nth-child('+i+')').show(); 

또는 더 나은

$(component+' > div:nth-child('+i+')').show(); 

, 또한, 자식 div의 내부 요소를 선택할 수 있습니다 쓸 수 있습니다 존재합니다.