Selenium 自動化操作瀏覽器
Selenium 是一個能夠自動化操作瀏覽器的工具，它的應用範圍非常廣泛，如：在開發網頁應用程式時，會使用 Selenium 來測試網頁功能、要搶 PS5 時，也可以利用 Selenium 來撰寫自動購物程式…… 等等，是一套功能十分強大的工具。
話說在好幾年前，我第一次學習 Selenium，為了要測試公司的網頁，但那個時候還沒有中文的教學書，能找到的範例也不多，加上我當時是使用 Java 語言，因此在學習的過程中十分辛苦，所以這次透過 Python，希望可以讓初學者輕鬆學會，如何使用 Selenium 來操作網頁，不過今天的範例不會教怎麼搶 PS5 (我自己也沒搶到…… 😭)，只會簡單操作網頁，進入 Yahoo 電影，搜尋電影資料。
要開始使用 Selenium 得要先有一些準備，用 Python 來撰寫的話，要先安裝 Selenium 模組，還要下載瀏覽器的 WebDriver…… 等，那麼接下來就往下開始教學，如有什麼疑問歡迎在文章最底下留言詢問！
一、安裝 Selenium 模組
1. 開啟「命令提示字元 / cmd」，並輸入以下語法後按 Enter 安裝：
「pip install selenium」
安裝成功畫面：
二、下載瀏覽器的 WebDriver
以 Google Chrome 作示範：
1. 開啟妳的 Google 瀏覽器，點網頁右上角的三點 / 說明 / 關於 Google Chrome，找到妳的瀏覽器版本號。
2. 於瀏覽器輸入以下網址：
「https://chromedriver.chromium.org/downloads」
找到和妳瀏覽器對應的版本的 WebDriver
下載 WebDriver
下載好後請解壓縮，裡面有一個 chromedriver.exe 檔案，這個檔案等等要跟妳的 Python 檔案，放在同一個資料夾。
P.S. 如果要用 Edge，可以到「https://developer.microsoft.com/zh-tw/microsoft-edge/tools/webdriver/」下載。
三、Selenium 的語法和使用方法
1. 要使用 Selenium，一開始得先匯入套件。
「from selenium import webdriver」
2. 然後要建立一個物件
「driver = webdriver.Chrome()」
上述的變數 driver 就是一個瀏覽器物件；因為我是用 Google Chrome 做示範，所以用 Chrome() 方法，如果用 Edge 瀏覽器，則將此方法改為 Edge()，如下：
「driver = webdriver.Edge()」
建立好 driver 物件後，有一些常用的方法及說明，以下表介紹：
| 屬性及方法 | 介紹 |
| maximize_window() | 將瀏覽器視窗放到最大 |
| get(url) | 連結到參數 url 的網頁 |
| current_url | 取得目前網頁的網址 |
| close() | 關閉瀏覽器 |
| quit() | 關閉瀏覽器及退出程式 |
| click() | 點擊按鈕 |
| send_keys(‘The Batman’) | 以鍵盤輸入「The Batman」 |
| refresh() | 重新整理網頁 |
| back() | 上一頁 |
| forward() | 下一頁 |
| submit() | 提交表單資料 |
更多使用方法可到它的網站查看
「https://www.selenium.dev/documentation/」
3. 雖然使用上表的 get(url) 方法後即可進入一個網頁，但是如果想要和網頁有所互動的話，我們還必須找網頁裡的元素，例如我要在搜尋框輸入資料，並且按下搜尋按鈕進行查詢，那麼我就必須找到搜尋框和按鈕這兩個元素，才能進行我要的動作。
尋找網頁元素的方法，以下表說明：
此為舊語法，等會兒會再介紹新語法。
| 方法 | 介紹 |
| find_element_by_id(id) | 以 id 查詢 |
| find_element_by_class_name(name) | 以類別名稱查詢 |
| find_element_by_tag_name(tagname) | 以 HTML 標籤查詢 |
| find_element_by_name(name) | 以名稱查詢 |
| find_element_by_link_text(text) | 以連結文字查詢 |
| find_element_by_partial_link_text(text) | 以部份連結文字查詢 |
| find_element_by_css_selector(selector) | 以 CSS 選擇器查詢 |
| find_element_by_xpath(xpath) | 以 xml 路徑查詢 |
將上述兩個表格，大致瞄過一遍，接下來我們實際撰寫程式，來更加瞭解上述方法的使用方式。
四、程式撰寫
現在，我們要來寫一個，能夠開啟 Yahoo 電影的網頁，並於搜尋框輸入電影名稱後，按下搜尋按鈕的程式。
請開啟妳的萬能記事本，並輸入以下程式碼：
1. 匯入套件
from selenium import webdriver
import time2. 建立 driver 瀏覽器物件變數
url = 'https://movies.yahoo.com.tw/'
driver = webdriver.Chrome()3. 將瀏覽器放到最大，並進入 Yahoo 電影網站。
driver.maximize_window()
driver.get(url)
time.sleep(5) # 停留五秒鐘P.S. 有時候程式執行太快，有些元素還沒加載到網頁中，這時如果程式沒找到我們要的元素，就會終止程式並拋出錯誤訊息，這時候我們可以使用 time 套件的 sleep 方法，等待一段時間後再繼續往下執行。
4. 接下來我們要搜尋網頁內搜尋框和按鈕的元素，請先開啟瀏覽器，並輸入以下網址到 Yahoo 電影網站。
「https://movies.yahoo.com.tw/」
將滑鼠移到搜尋框，按下右鍵後點選「檢查」，即可在網頁右方或下方看到它的原始碼。
這裡可以看到它的 id 為「serchinput」，所以這個搜尋框我們就以 id 搜尋的方式，來找這個元素，請將 id 先複製到記事本。
P.S. id 是網頁中唯一的值，也就是說不會有其他標籤的 id 跟它一樣，所以用 id 搜尋就不會找錯元素了。
回到程式，輸入以下程式碼：
driver.find_element_by_id('serchinput')不過因為還要對這個搜尋框輸入資料，所以我們在剛剛的程式碼後面，再加一個 send_keys() 方法，代表要將資料輸入到這個搜尋框，修改如下：
driver.find_element_by_id('serchinput').send_keys('The Batman')最後是搜尋按鈕元素，跟剛剛一樣，回到網頁後在搜尋按鈕按右鍵檢查，可以找到它的元素。
這個元素我以 XPath 的方式做示範，將滑鼠移到找到的標籤，然後按右鍵選擇 Copy / Copy XPath，先複製到記事本。
接著再回到程式，請輸入以下程式碼：
driver.find_element_by_xpath('//*[@id="y_serch_l"]/form/button[1]')因為要對按鈕做點擊的動作，所以再最後還要加上 click() 方法，請修改如下：
driver.find_element_by_xpath('//*[@id="y_serch_l"]/form/button[1]').click()程式到這裡就撰寫完成了！可以執行程式檔跑看看
P.S. Python 程式檔要和 WebDriver 放在同一個資料夾
from selenium import webdriver # 匯入套件
import time
url = 'https://movies.yahoo.com.tw/' # Yahoo 電影網站的網址
driver = webdriver.Chrome() # 建立瀏覽器物件變數
driver.maximize_window() # 將瀏覽器放到最大
driver.get(url) # 連結到 Yahoo 電影網站
time.sleep(5) # 停留五秒鐘
driver.find_element_by_id('serchinput').send_keys('The Batman') # 將 The Batman 輸入到搜尋框
time.sleep(3) # 停留三秒鐘
driver.find_element_by_xpath('//*[@id="y_serch_l"]/form/button[1]').click() # 點擊搜尋按鈕五、更改為新語法
剛剛撰寫完畢的程式檔，雖然能夠成功執行，但是打開 cmd 看，有一段警告訊息，如下：
DeprecationWarning: find_element_by_* commands are deprecated. Please use find_element() instead
find_element_by_* 要改為 find_element()
例如將剛剛的
find_element_by_id(‘serchinput’)
要改成
find_element(By.ID, ‘serchinput’)
要更改並不困難，只要將 _by_id 刪掉，並在代入參數的前方，加入 By.ID 就好，如果是 XPath 就是 By.XPATH。
且開頭還要再輸入以下語法，匯入模組：
from selenium.webdriver.common.by import By
完整程式碼如下：
from selenium import webdriver # 匯入套件
from selenium.webdriver.common.by import By
import time
url = 'https://movies.yahoo.com.tw/' # Yahoo 電影網站的網址
driver = webdriver.Chrome() # 建立瀏覽器物件變數
driver.maximize_window() # 將瀏覽器放到最大
driver.get(url) # 連結到 Yahoo 電影網站
time.sleep(5) # 停留五秒鐘
# 舊語法
"""
driver.find_element_by_id('serchinput').send_keys('The Batman') # 將 The Batman 輸入到搜尋框
time.sleep(3) # 停留三秒鐘
driver.find_element_by_xpath('//*[@id="y_serch_l"]/form/button[1]').click() # 點擊搜尋按鈕
"""
driver.find_element(By.ID, 'serchinput').send_keys('The Batman') # 將 The Batman 輸入到搜尋框
time.sleep(3) # 停留三秒鐘
driver.find_element(By.XPATH, '//*[@id="y_serch_l"]/form/button[1]').click() # 點擊搜尋按鈕最後附上語法更新的表格
| 舊語法 | 新語法 |
| find_element_by_class_name(“”) | find_element(By.CLASS_NAME, “”) |
| find_element_by_id(“”) | find_element(By.ID, “”) |
| find_element_by_name(“”) | find_element(By.NAME, “”) |
| find_element_by_link_text(“”) | find_element(By.LINK_TEXT, “”) |
| find_element_by_partial_link_text(“”) | find_element(By.PARTIAL_LINK_TEXT, “”) |
| find_element_by_tag_name(“”) | find_element(By.TAG_NAME, “”) |
| find_element_by_css_selector(“”) | find_element(By.CSS_SELECTOR, “”) |
| find_element_by_xpath(“”) | find_element(By.XPATH, “”) |
那麼，這次的教學就到這邊～～祝同學們學習順利
Python 程式檔案下載：
範例執行影片
如果覺得文章內容還不錯的話，麻煩請幫我點個讚！感謝
可以多點幾次喔~~
第一次點讚需使用 Google 或 Facebook 帳號註冊
