상위 요소를 모르고 N번째 요소를 어떻게 선택할 수 있습니까?

부모 요소에 대한 지식 없이 n번째 자식 선택

동적 코드로 작업할 때 부모 요소가 부모 요소일 때 n번째 요소를 선택하는 것이 어려울 수 있습니다. 알려지지 않았습니다. 그러나 이는 :first-child 및 :nth-child()와 같은 CSS 선택기를 사용하여 달성할 수 있습니다.

:first-child 및 :nth-child()

이 선택기를 사용하면 상위 요소 내의 위치에 따라 요소를 선택할 수 있습니다. 예를 들어 :first-child는 첫 번째 하위 요소를 선택하고, :nth-child(2)는 두 번째 하위 요소를 선택합니다.

:first, :last, :nth가 존재하지 않는 이유

:first-child, :nth-child()와 달리 :first, :last, :nth와 같은 선택자는 구분이 없기 때문에 존재하지 않습니다. 요소는 전체 문서의 첫 번째, 마지막 또는 n번째 요소입니다. 루트 요소를 제외한 모든 요소는 다른 요소의 하위 요소입니다.

예

다음 예에서 두 번째 단락을 선택하려면 다음 선택기를 사용하세요.

<youdontknowwhat!>
  <p class="select-me">One</p>
  <p class="select-me">Two</p>
</youdontknowwhat!>

.select-me:nth-child(2)

이 선택기는 상위 요소에 관계없이 두 번째 .select-me 요소를 선택합니다. 요소.

위 내용은 상위 요소를 모르고 N번째 요소를 어떻게 선택할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!