웹사이트를 크롤링할 때 h2와 h3가 동일한 구조를 가지고 있는 것 같습니다. h2:first-child는 데이터를 얻을 수 있는데 h3는 왜 얻을 수 없나요?
최종 결과 h2_1과 h2_2는 동일하므로 문제 없습니다. h3_1은 괜찮은데, h3_2는 비어 있는데 왜 이럴까요?
코드는 다음과 같습니다.
선택자 xxx:first-child는 xxx의 상위 요소의 첫 번째 하위 요소가 xxx일 때 xxx를 선택하려면 이 두 가지 조건이 동시에 충족되어야 함을 의미합니다.
는 xxx의 상위 요소의 첫 번째 하위 요소가 아니며, xxx의 상위 요소의 하위 요소 중 첫 번째 xxx도 아닙니다
h2.font-headline-teaser의 상위 요소 중 첫 번째 하위 요소는 h2.font-headline-teaser이므로 선택할 수 있습니다
h3.font-sub-headline 상위 요소의 첫 번째 하위 요소가 h3.font-sub-headline이 아니므로 비어 있습니다
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
선택자 xxx:first-child는 xxx의 상위 요소의 첫 번째 하위 요소가 xxx일 때 xxx를 선택하려면 이 두 가지 조건이 동시에 충족되어야 함을 의미합니다.
는 xxx의 상위 요소의 첫 번째 하위 요소가 아니며, xxx의 상위 요소의 하위 요소 중 첫 번째 xxx도 아닙니다
h2.font-headline-teaser의 상위 요소 중 첫 번째 하위 요소는 h2.font-headline-teaser이므로 선택할 수 있습니다
h3.font-sub-headline 상위 요소의 첫 번째 하위 요소가 h3.font-sub-headline이 아니므로 비어 있습니다