[ jquery 기초 ] jquery Filter - 자식 필터(Child Filter)

 

| 자식필터

앞서 다룬 기본 필터와 유사한 모습을 하고 있지만 :first, :last 경우 단일 요소가 반환 되지만, 자식필터의 경우 단일요소가 아닌 집합을 반환하게 된다.

필터 종류 및 형식	필터 설명
:first-child	자식 요소 중 첫번째에 해당하는 요소를 모두 반환합니다.
:last-child	자식 요소 중 마지막에 해당하는 요소를 모두 반환합니다.
:nth-child (index/odd/even/equation)	자식 요소 중 지정된 값에 해당하는 요소를 모두 반환합니다.
:only-child	자신이 부모 요소와 유일한 자식인 모든 요소를 반환합니다.

 

| Nth-child

기본적인 동작은 다른 필터와 동일합니다. 특이한 점은 index, even, odd 같은 값을 지정하여 사용을 하거나 수식을 이용한 규칙적인 동작을 하도록 할 수 있습니다. $(“td:nth-child(2n+1)”)을 풀어보면 2의배수(2n)에 1을 더한 값에 해당하는 위치에 있는 요소를 선택을 하게 됩니다. 여기서 가장 중요한 부분은 n은 1이 아닌 0부터 시작을 한다는 것입니다. 1이 아닌 0부터 시작을 하므로 수식을 풀면 “1, 3, 5, 7, 9, 11…”의 형식이 됩니다.