보다 큰 직접 자손 선택기

Question

숫자가 7보다 큰 모든 정렬되지 않은 목록에서 모든 목록 항목을 선택해야합니다.

이 코드 :

$("ul.seven > li:gt(6)").hide() 

너무 욕심이고, 페이지의 첫 번째 순서가없는 목록은 제대로 작동하지만 다음 정렬되지 않은 목록의 모든 후속 목록 항목을 숨 깁니다. 올바른 선택기는 무엇입니까?

Answer 1

:gt()가 ul.seven > li의 전체 세트를 대조와 관계없이, 그 결합 된 세트에서 여섯 li 후 다 집어 그 부모의. 이 결과 집합에 .slice()을 수행 한 후 그 li의 모든 요소를 ​​선택하고 동등의 :

당신이 기대하는 것과는 매우 다른 무언가를

$("ul.seven > li").slice(7).hide(); 

. behaves more like what you expect of a CSS simple selector 대신 :nth-child() 원하는

:

$("ul.seven > li:nth-child(n+8)").hide(); 

:nth-child(n+8) 의미는 의미 :gt(6)에 거의 동등하다, "1 인덱스에 따라 8 어린이부터 시작" "를 기반으로 7 경기에서 시작 0 색인에 "(혼란스럽게, 나는 안다). Selectors spec for :nth-child(), jQuery API documentation for :gt() 및 jQuery API documentation for .slice()을 비교하십시오.

Answer 2

시도이 (실질적으로 동일 함)

$("ul.seven").each(function() { 
    $(this).find("> li:gt(6)").hide(); 
}); 

또는

$("ul.seven").each(function() { 
    $(this).children("li:gt(6)").hide(); 
});