iT邦幫忙

2023 iThome 鐵人賽

DAY 9
0

前面有講過該如何尋找網頁元素,而在Selenium裡面要尋找元素也是大同小異。

首先先創建實例

from selenium import webdriver
from selenium.webdriver.chrome.options import Options

chrome_option = Options()

#用ChromeDriver創建瀏覽器實例
driver = webdriver.Chrome(options=chrome_option)

#目標網站URL
url = "https://example.com"

#連到網站
driver.get(url)

Selenium 中定位元素的主要方法有:

  1. find_element_by_id()

通過元素的 id 屬性值定位:

driver.find_element_by_id("elementId")
  1. find_element_by_name()

通過元素的 name 屬性值定位:

driver.find_element_by_name("elementName")
  1. find_element_by_xpath()

通過 XPath 表達式定位:

driver.find_element_by_xpath("//div[@id='elementId']") 
  1. find_element_by_link_text()

通過完整的鏈接文本定位:

driver.find_element_by_link_text("鏈接文本")
  1. find_element_by_partial_link_text()

通過部分鏈接文本定位:

driver.find_element_by_partial_link_text("部分文本")
  1. find_element_by_tag_name()

通過 HTML 標籤名定位:

driver.find_element_by_tag_name("input")
  1. find_element_by_class_name()

通過 class 屬性值定位:

driver.find_element_by_class_name("className")
  1. find_element_by_css_selector()

通過 CSS 選擇器定位:

driver.find_element_by_css_selector("#elementId")

還有一個方法是導入

from selenium.webdriver.common.by import By

如果使用該方法則元素定位的方法與示例如下:

  1. find_element(By.ID, 'id值')
driver.find_element(By.ID, 'elementId')
  1. find_element(By.NAME, 'name值')
driver.find_element(By.NAME, 'elementName')
  1. find_element(By.XPATH, 'xpath表達式')
driver.find_element(By.XPATH, '//div[@id="elementId"]')
  1. find_element(By.LINK_TEXT, '鏈接文字')
driver.find_element(By.LINK_TEXT, '鏈接文本')
  1. find_element(By.PARTIAL_LINK_TEXT, '部分鏈接文字')
driver.find_element(By.PARTIAL_LINK_TEXT, '部分文本') 
  1. find_element(By.TAG_NAME, '標籤名稱')
driver.find_element(By.TAG_NAME, 'input')
  1. find_element(By.CLASS_NAME, 'class名稱')
driver.find_element(By.CLASS_NAME, 'className')  
  1. find_element(By.CSS_SELECTOR, 'css選擇器')
driver.find_element(By.CSS_SELECTOR, '#elementId')

其中 By 模塊提供了定位元素的各種方式,使代碼看起來更清晰簡潔。用法與直接使用方法類似。


上面兩種方式都是尋找單一元素若要尋找多個元素的話只需將element改為elements即可。

除此之外也能夠使用前面介紹過的JavaScript來尋找元素,使用方法是如下:

element = driver.execute_script("return document.getElementById('element_id')") # 在這裡放入JS程式碼

或是

with open('example.js', 'r', encoding="utf-8") as f:
    js = f.read()
element = driver.execute_script(js)#放入讀取的.js檔案

這樣也可以


而在Selenium中,如果要找到某個元素下面的子元素,可以通過以下方式:

  1. 通過父元素的查找方式鍊式定位

例如,先定位到父元素,然後調用find_element方法再定位子元素:

parent = driver.find_element_by_id("parent")
child = parent.find_element_by_class_name("child")
  1. 通過XPath或CSS Selector指定元素層級關係定位

例如使用XPath的 "//父元素[@屬性='值']/子元素" 方式定位:

child = driver.find_element_by_xpath("//div[@id='parent']/span[@class='child']")

或者使用CSS Selector的 "父元素屬性值 > 子元素屬性值" 方式定位:

child = driver.find_element_by_css_selector("#parent > .child")

在這兩種方式中,都依賴於先定位父元素,然後再尋找該父元素內的子元素。

需要注意避免使用過於寬泛的父元素定位,否則可能定位到多個父元素,從而找到意外的子元素。


上一篇
[DAY8]尋找網站內容要素的方式
下一篇
[DAY10]Selenium等待
系列文
selenium爬蟲應用至discord bot30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言