1. 獲取元素的文字內容
2. 獲取元素的屬性值 (href, src, title)
3. 獲取元素的 HTML 內容
4. 處理動態載入的文字
5. 實戰範例：抓取新聞標題

準備工作：安裝 Selenium 和 WebDriver

你需要安裝 Selenium 套件，並下載對應你瀏覽器的 WebDriver。

安裝 Selenium

在終端機或命令提示字元中執行：

pip install selenium

下載 WebDriver

Selenium 本身不控制瀏覽器，它需要一個「中間人」—— WebDriver，你需要下載與你瀏覽器版本匹配的 WebDriver。

• Google Chrome: 使用 ChromeDriver，請下載與你的 Chrome 瀏覽器版本最接近的 chromedriver。
• Firefox: 使用 GeckoDriver。
• Edge: 使用 EdgeDriver。

重要: 將下載好的 WebDriver 可執行檔（chromedriver.exe 或 geckodriver）放在一個容易找到的路徑，或者將其路徑加入到系統的環境變數中，這樣 Python 就能自動找到它。

獲取元素的文字內容

這是最常見的需求,網頁上的文字通常被包含在某個 HTML 標籤中（如 <p>, <h1>, <div>, <span>），我們需要先定位到這個元素，然後再獲取它的文字。

主要方法：

• .text: 這是最常用的方法，它會返回元素「可見」的文字內容，並自動處理文字前後的空白。注意： 它不會返回 <script> 或 <style> 標籤中的文字。

範例程式碼：

假設我們有以下 HTML 片段：

<h1 id="main-title">這是一個主標題</h1>
<p class="description">這是一段描述文字。</p>
<div class="hidden-text" style="display:none;">這段文字不會被顯示。</div>

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager # 自動管理 WebDriver 的套件 (推薦)
# --- 初始化 WebDriver ---
# 方法一：使用 webdriver-manager 自動下載和管理 (推薦)
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
# 方法二：手動指定 WebDriver 路徑
# driver = webdriver.Chrome(service=Service('C:/path/to/your/chromedriver.exe'))
# 打開一個網頁
driver.get("https://example.com") # 替換成你要抓取的網頁
try:
    # --- 獲取文字內容 ---
    # 1. 通過 ID 獲取 h1 的文字element = driver.find_element(By.ID, "main-title")text = title_element.text
    print(f"主標題: {title_text}")
    # 2. 通過 class 名稱獲取 p 的文字
    desc_element = driver.find_element(By.CLASS_NAME, "description")
    desc_text = desc_element.text
    print(f"描述: {desc_text}")
    # 3. 獲取隱藏元素的文字 (使用 .text 會得到空字串)
    hidden_element = driver.find_element(By.CLASS_NAME, "hidden-text")
    hidden_text = hidden_element.text
    print(f"隱藏文字: '{hidden_text}'") # 輸出會是 ''
    # 4. 使用 XPath 定位 (更靈活)
    # 獲取所有 class 為 'description' 的 p 標籤的文字
    all_desc_elements = driver.find_elements(By.XPATH, "//p[@class='description']")
    for i, element in enumerate(all_desc_elements):
        print(f"描述文字 {i+1}: {element.text}")
finally:
    # 關閉瀏覽器
    driver.quit()

獲取元素的屬性值

有時我們需要的不是文字,而是標籤的屬性，例如連結的 href、圖片的 src、按鈕的 title 等。

主要方法：

• .get_attribute("attribute_name"): 這個方法用來獲取指定屬性的值。

範例程式碼：

假設有以下 HTML：

<a href="https://www.python.org" target="_blank" title="Python 官方網站">Python</a>
<img src="image.png" alt="一張圖片">

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
driver.get("https://example.com")
try:
    # 獲取 a 標籤的 href 屬性
    link_element = driver.find_element(By.TAG_NAME, "a")
    link_url = link_element.get_attribute("href")
    print(f"連結網址: {link_url}")
    # 獲取 a 標籤的 title 屬性
    link_title = link_element.get_attribute("title")
    print(f"連結標題: {link_title}")
    # 獲取 img 標籤的 src 屬性
    img_element = driver.find_element(By.TAG_NAME, "img")
    img_src = img_element.get_attribute("src")
    print(f"圖片路徑: {img_src}")
finally:
    driver.quit()

獲取元素的 HTML 內容

如果你想獲取元素完整的 HTML 標籤及其所有內容，可以使用 .get_attribute("outerHTML")，如果你只想獲取元素內部（不包括標籤本身）的 HTML，可以使用 .get_attribute("innerHTML")。

範例程式碼：

<div id="content">
    <p>這是段落。</p>
</div>

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
driver.get("https://example.com")
try:
    # 獲取元素的完整 HTML (包括 <div> 標籤本身)
    content_element = driver.find_element(By.ID, "content")
    outer_html = content_element.get_attribute("outerHTML")
    print("Outer HTML:")
    print(outer_html)
    # 輸出: <div id="content"><p>這是段落。</p></div>
    # 獲取元素內部的 HTML (不包括 <div> 標籤)
    inner_html = content_element.get_attribute("innerHTML")
    print("\nInner HTML:")
    print(inner_html)
    # 輸出: <p>這是段落。</p>
finally:
    driver.quit()

處理動態載入的文字

現代網頁很多內容是透過 JavaScript 動態載入的，如果你在內容還未載入完畢就去抓取文字，會得到空字串或舊的內容。

解決方案是 「等待」，Selenium 提供了 WebDriverWait 和 expected_conditions 來解決這個問題。

主要方法：

• WebDriverWait(driver, timeout): 在指定的 timeout 秒內，等待某個條件滿足。
• expected_conditions.presence_of_element_located((By, value)): 一個常見的條件，表示「元素已經存在於 DOM 中」。
• expected_conditions.visibility_of_element_located((By, value)): 更嚴格的條件，表示「元素不僅存在，而且是可見的」。

範例程式碼：

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
driver.get("https://example.com/some-page-with-dynamic-content")
try:
    # 設置等待時間，最多等待 10 秒
    wait = WebDriverWait(driver, 10)
    # 等待直到 ID 為 'dynamic-text' 的元素變得可見
    # 10 秒內還沒出現，程式會�出 TimeoutException
    dynamic_text_element = wait.until(
        EC.visibility_of_element_located((By.ID, "dynamic-text"))
    )
    # 現在可以安全地獲取文字，因為元素已經載入並可見
    dynamic_text = dynamic_text_element.text
    print(f"動態載入的文字: {dynamic_text}")
finally:
    driver.quit()

實戰範例：抓取新聞標題

讓我們來抓取一個新聞網站的首頁標題。

目標: 抓取中央社新聞網首頁前三則新聞的標題。

import time
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
driver.get("https://www.cna.com.tw/")
try:
    # 中央社的標題通常在 class 為 'cList' 的 li 標籤下的 a 標籤中
    # 使用 find_elements 來獲取所有符合條件的元素列表
    news_links = driver.find_elements(By.CSS_SELECTOR, "li.cList a")
    print("--- 中央社新聞標題 ---")
    # 只取前三則
    for i, link in enumerate(news_links[:3]):
        # 標題通常在 a 標籤的文字中
        title = link.text.strip()
        # 為了避免標題太長或格式問題，我們只取前 30 個字元
        print(f"{i+1}. {title[:30]}...")
finally:
    # 等待一下再關閉，讓你看清楚結果
    time.sleep(3)
    driver.quit()

注意: 網站的 HTML 結構可能會隨時更新，CSS Selector 或 XPath 可能需要根據實際情況調整，你可以使用瀏覽器的「開發者工具」 (F12) 來檢查元素，找到最穩定的定位方式。

總結

希望這個詳細的教學能幫助你掌握使用 Selenium 處理網頁文字的技巧！