Selenium과 CSS Selector 기초 강의 자료

출처 : https://www.youtube.com/watch?v=qhy8I4ChCuw&t=18s

목차

1. 준비 사항
2. Selenium으로 웹 브라우저 제어하기
3. 웹 페이지 로드 및 요소 대기
4. 요소 선택과 자동화
5. 데이터 추출 및 활용
6. 전체 코드 제시
7. 결론

---

1. 준비 사항

Selenium을 사용하기 위해 다음과 같은 모듈을 설치해야 합니다.

pip install selenium

---

2. Selenium으로 웹 브라우저 제어하기

먼저 Selenium으로 웹 브라우저를 실행하고 자동화 작업을 수행할 준비를 합니다.

from selenium import webdriver

# 크롬 드라이버 실행
driver = webdriver.Chrome()

# 접속할 URL 설정
url = "http://naver.com"

# URL 접속하기
driver.get(url)

---

3. 웹 페이지 로드 및 요소 대기

웹 페이지의 요소가 로드될 때까지 기다리는 작업은 WebDriverWait을 통해 수행할 수 있습니다.

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

# 특정 요소가 로드될 때까지 대기 (최대 10초)
element = WebDriverWait(driver, 10).until(
    EC.presence_of_element_located((By.ID, "query"))
)

위 코드는 ID가 query인 요소가 최대 10초 동안 나타날 때까지 기다립니다.

---

4. 요소 선택과 자동화

HTML 페이지에서 다양한 방법으로 요소를 찾고 동작을 자동화할 수 있습니다.

# 클래스 이름으로 검색창 찾기
driver.find_element(By.CLASS_NAME, "search_input").send_keys("class ")

# ID로 검색창 찾기
driver.find_element(By.ID, "query").send_keys("id ")

# name 속성으로 검색창 찾기
driver.find_element(By.NAME, "query").send_keys("query ")

# CSS 셀렉터로 검색창 찾기 (가장 많이 사용되는 방법)
driver.find_element(By.CSS_SELECTOR, "[title='검색어를 입력해 주세요.']").send_keys("title ")

# 링크 텍스트로 특정 링크 클릭하기
driver.find_element(By.LINK_TEXT, "쇼핑투데이").click()
driver.find_element(By.LINK_TEXT, "경제").click()

# 부분적인 링크 텍스트로 특정 링크 클릭하기
driver.find_element(By.PARTIAL_LINK_TEXT, "핑투데").click()

• By.CLASS_NAME: 클래스 이름을 이용해 요소를 찾습니다.
• By.ID: ID를 이용해 요소를 찾습니다.
• By.NAME: name 속성을 통해 요소를 찾습니다.
• By.CSS_SELECTOR: CSS Selector를 이용해 원하는 요소를 찾습니다. 가장 일반적으로 사용되는 방법입니다.
• By.LINK_TEXT, By.PARTIAL_LINK_TEXT: 링크 텍스트 전체 혹은 일부를 이용해 링크 요소를 찾고 클릭할 수 있습니다.

---

5. 데이터 추출 및 활용

특정 영역에 있는 여러 요소를 찾아 데이터를 추출하고 활용할 수 있습니다.

# CSS 셀렉터로 여러 요소 찾기
for element in driver.find_elements(By.CSS_SELECTOR, "#shortcutArea .shortcut_item .link_service"):
    # 각 요소의 HTML 코드 출력
    print(element.get_attribute("outerHTML"))
    print()

find_elements를 사용하면 해당 조건에 맞는 모든 요소를 리스트로 반환합니다.

---

6. 전체 코드 제시

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time

# 크롬 드라이버 실행
driver = webdriver.Chrome()

# 접속할 URL 설정
url = "http://naver.com"

# URL 접속하기
driver.get(url)

# 특정 요소가 로드될 때까지 대기 (최대 10초)
element = WebDriverWait(driver, 10).until(
    EC.presence_of_element_located((By.ID, "query"))
)

# HTML 요소 선택 및 자동화 작업 수행
driver.find_element(By.CLASS_NAME, "search_input").send_keys("class ")
driver.find_element(By.ID, "query").send_keys("id ")
driver.find_element(By.NAME, "query").send_keys("query ")
driver.find_element(By.CSS_SELECTOR, "[title='검색어를 입력해 주세요.']").send_keys("title ")
driver.find_element(By.LINK_TEXT, "쇼핑투데이").click()
driver.find_element(By.LINK_TEXT, "경제").click()
driver.find_element(By.PARTIAL_LINK_TEXT, "핑투데").click()

# 특정 영역의 모든 요소 찾기 및 출력
for element in driver.find_elements(By.CSS_SELECTOR, "#shortcutArea .shortcut_item .link_service"):
    print(element.get_attribute("outerHTML"))
    print()

---

7. 결론

Selenium을 통해 웹 브라우저 제어 및 데이터 추출 작업을 수행해 보았습니다.

• WebDriverWait를 통해 요소가 로드될 때까지 기다리는 작업을 수행하며, 이는 페이지가 동적으로 로드될 때 유용합니다.
• 다양한 요소 선택 방법을 통해 원하는 HTML 요소를 찾고 자동화 작업을 수행할 수 있습니다.
• 추출한 데이터는 콘솔에 출력하거나 다른 파일 형태로 저장해 활용할 수 있습니다.

이번 실습을 통해 Selenium의 기본적인 사용법을 익히고, 웹 페이지를 자동화하는 방법을 배웠습니다.