[ 크롤링-Beautifulsoup ] Python Beautifulsoup select() [ (li, a), (li a), (li > a) ]

◆ select(element, element) / select(element element) / select(element > element)

BeautifulSoup의 select() 함수 사용시

select(element, element) / select(element element) / select(element > element) 의 차이점을

알아보도록 하겠습니다.

예시는 나무위키 메인페이지를 참고하여

[ select(li, a) / select(li a) / select(li > a) ]

를 통해 알아보겠습니다.

◆ select(element, element)

select(li, a)는 해당 페이지의 모든 <li> 태그와 <a>태그의 내용을 모두 선택합니다.

i = 1

tests0 = soup.select('li, a')
for test0 in tests0:
    print(i, test0)
    i = i + 1

위와 같이 코드를 작성하고 결과를 확인해 보겠습니다.

(변수 i 는 단순히 카운트 하기위해 넣은 것입니다. 없어도 상관은 없습니다.)

첫번째 결과입니다. 아래 그림 부분이 추출된 것임을 알 수 있습니다.

<a class="r-feo3FN" data-v-b0989f66="" href="/"></a>

 

두번째 결과입니다. 마찬가지로 아래 그림 부분이 추출된 것임을 알 수 있습니다.

<li data-v-6678db84="" data-v-b0989f66=""><a data-v-6678db84="" href="/RecentChanges" title="최근 변경"><span class="DHxtK-U6 ion-md-compass" data-v-6678db84=""></span> <span class="JSCmVi5p" data-v-6678db84=""> 
최근 변경</span></a></li>

 

반응형

세번째 결과입니다.

두번째 결과의 a 태그 부분만 추출이 되었습니다.

<a data-v-6678db84="" href="/RecentChanges" title="최근 변경"><span class="DHxtK-U6 ion-md-compass" data-v-6678db84=""></span> <span class="JSCmVi5p" data-v-6678db84="">최근 변경</span></a>

이런 방식으로 모든 li 태그와 a 태그를 찾습니다.

 

◆ select(element element)

select(li a)는 해당 페이지 <li> 태그 안에 있는 <a> 태그를 모두 찾습니다.

위와 유사한 방법으로 확인해 보겠습니다.

i = 1
tests1 = soup.select('li a')
for test1 in tests1:
    print(i, test1)
    i=i+1

 

첫번째 결과입니다.

<a data-v-6678db84="" href="/RecentChanges" title="최근 변경"><span class="DHxtK-U6 ion-md-compass" data-v-6678db84=""></span> <span class="JSCmVi5p" data-v-6678db84="">최근 변경</span></a>

먼가 결과물이 달라진 것을 알 수 있습니다.

select(li, a)를 했을 때 첫번째 결과와 비교해보시기 바랍니다.

<a class="r-feo3FN" data-v-b0989f66="" href="/">

는 li 태그의 하위태그가 아니었습니다.

그렇기 때문에 li 태그의 하위에 있는 a 태그만을 추출하는

select(li a)를 사용할 시 결과값으로 반영되지 않습니다.

다음은 세번째 결과와 네번째 결과를 살펴보겠습니다.

세번째 결과입니다.

<a data-v-b3baf8e0="" href="#" title="특수 기능"><span class="zaaHDH+j ion-ios-cube" data-v-b3baf8e0=""></span> <span class="_5wf+zYUY" data-v-b3baf8e0="">특수 기능</span></a>

네번째 결과입니다.

<a data-v-28e976b0="" data-v-b0989f66="" data-v-b3baf8e0="" href="//board.namu.wiki/" title="게시판"><span class="ohuGKevT ion-ios-clipboard" data-v-28e976b0=""></span> <span class="zHD4Seky" data-v-28e976b0="">게시판</span></a>

위 그림의 빨간색 네모 안의 부분이 세번째, 네번째 결과에 해당하는 부분입니다.

확인하셔야 할 사항은 <li> 태그의 아래에 있는 <a> 태그라는 사실입니다.

세번째 결과는 <li> 태그의 바로 아래에 있는 <a> 태그입니다.

네번째 결과는 <li> 태그의 아래의 <div> 태그 아래의 <a> 태그입니다.

즉 <li> 태그 아래에 있기만하면 몇단계 아래에 있는지는 상관이 없습니다.

 

728x90

◆ select(element > element)

select(li > a)는 해당 페이지 <li> 태그 바로 아래에 있는 <a> 태그를 모두 찾습니다.

select(li > a) 사용시 빨간색 네모부분은 결과로 출력이 되지만

파란색 네모부분은 결과로 출력되지 않습니다.

select(li > a) 는 <li>태그의 바로 아래에 있는 <a>태그만을 찾습니다.

앞서 말했다시피 파란색 네모부분은 <li> 태그 아래의 <div>태그 아래에 있습니다.

빨간색 네모의 <a> 태그의 부모는 <li>태그 이지만

파랜색 네모의 <a> 태그의 부모는 <div>태그입니다.

 

여기를 방문하시면 더 많은 파이썬 관련 자료를 확인할 수 있습니다.

파이썬 공부하기