1. 選擇框
本章使用的html代碼:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h3 style="color: brown">radio框</h3> <div id="s_radio"> <input type="radio" name="radios" value="radio1">radio1<br> <input type="radio" name="radios" value="radio2">radio2<br> <input type="radio" name="radios" value="radio3" checked="checked">radio3 </div> <hr> <h3 style="color: brown">checkbox框</h3> <div id="s_checkbox"> <input type="checkbox" name="checkboxs" value="checkbox1">checkbox1<br> <input type="checkbox" name="checkboxs" value="checkbox2">checkbox2<br> <input type="checkbox" name="checkboxs" value="checkbox3" checked="checked">checkbox3 </div> <hr> <h3 style="color: brown">select框</h3> <h4 style="color: rgb(22, 118, 173)">單選</h4> <select id="ss_single"> <option value="option1">option1</option> <option value="option2">option2</option> <option value="option3" selected="selected">option3</option> </select> <hr> <h4 style="color: rgb(22, 118, 173)">多選</h4> <select id="ss_multi" multiple> <option value="options1">options1</option> <option value="options2">options2</option> <option value="options3" selected="selected">options3</option> </select> </body> </html>
1.1 radio框
radio框選擇選項,直接用WebElement的click方法,模擬用戶點擊就可以了。
比如,我們要在下面的html中:
先打印當前選中的值
再選擇radio2
<div id="s_radio"> <input type="radio" name="radios" value="radio1">radio1<br> <input type="radio" name="radios" value="radio2">radio2<br> <input type="radio" name="radios" value="radio3" checked="checked">radio3 </div>
對應的代碼如下:
from selenium import webdriver wd = webdriver.Chrome(r'E:\webdrivers\chromedriver.exe') wd.implicitly_wait(10) wd.get('http://127.0.0.1:8020/day01/index.html') # 獲取當前選中的元素 element = wd.find_element_by_css_selector( '#s_radio input[checked=checked]') print('當前選中的是: ' + element.get_attribute('value')) # 點選radio2 wd.find_element_by_css_selector('#s_radio input[value="radio2"]').click()
1.2 checkbox框
對checkbox進行選擇,也是直接用WebElement的click方法,模擬用戶點擊選擇。
需要注意的是,要選中checkbox的一個選項,必須先獲取當前該復選框的狀態,如果該選項已經勾選了,就不能再點擊。否則反而會取消選擇。
比如,我們要在下面的html中:選中checkbox2
<div id="s_checkbox"> <input type="checkbox" name="checkboxs" value="checkbox1">checkbox1<br> <input type="checkbox" name="checkboxs" value="checkbox2">checkbox2<br> <input type="checkbox" name="checkboxs" value="checkbox3" checked="checked">checkbox3 </div>
我們的思路可以是這樣:
先把已經選中的選項全部點擊一下,確保都是未選狀態
再點擊checkbox2
示例代碼:
from selenium import webdriver wd = webdriver.Chrome(r'E:\webdrivers\chromedriver.exe') wd.implicitly_wait(10) wd.get('http://127.0.0.1:8020/day01/index.html') # 先把 已經選中的選項全部點擊一下 elements = wd.find_elements_by_css_selector( '#s_checkbox input[checked="checked"]') for element in elements: element.click() # 再點擊checkbox2 wd.find_element_by_css_selector("#s_checkbox input[value='checkbox2']").click()
1.3 select框
radio框及checkbox框都是input元素,只是里面的type不同而已。
select框則是一個新的select標簽,大家可以對照瀏覽器網頁內容查看一下。
對於Select 選擇框,Selenium專門提供了一個select類進行操作。
1.3.1 常用方法
Select類提供了如下的方法:
(1) select_by_value
根據選項的value屬性值,選擇元素。
比如,下面的HTML:
<option value="foo">Bar</option>
就可以根據 foo 這個值選擇該選項:
s.select_by_value('foo')
(2) select_by_index
根據選項的次序(從1開始),選擇元素。
(3) select_by_visible_text
根據選項的可見文本,選擇元素。
比如,下面的HTML:
<option value="foo">Bar</option>
就可以根據Bar這個內容,選擇該選項:
s.select_by_visible_text('Bar')
(4) deselect_by_value
根據選項的value屬性值,去除選中元素。
(5) deselect_by_index
根據選項的次序,去除選中元素。
(6) deselect_by_visible_text
根據選項的可見文本,去除選中元素。
(7) deselect_all
去除選中所有元素。
1.3.2 Select單選框
對於 select單選框,操作比較簡單:
不管原來選的是什么,直接用Select方法選擇即可。
例如,選擇示例里面的option2,示例代碼如下:
from selenium import webdriver wd = webdriver.Chrome(r'E:\webdrivers\chromedriver.exe') wd.implicitly_wait(10) wd.get('http://127.0.0.1:8020/day01/index.html') # 導入Select類 from selenium.webdriver.support.ui import Select # 創建Select對象 select = Select(wd.find_element_by_id("ss_single")) # 通過 Select 對象選中option2 select.select_by_visible_text("option2")
1.3.3 Select多選框
對於select多選框,要選中某幾個選項,要注意去掉原來已經選中的選項。
例如,我們選擇示例多選框中的options2和options3。
可以用select類的deselect_all方法,清除所有 已經選中 的選項。
然后再通過select_by_visible_text方法選擇options2和options3。
示例代碼如下:
from selenium import webdriver wd = webdriver.Chrome(r'E:\webdrivers\chromedriver.exe') wd.implicitly_wait(10) wd.get('http://127.0.0.1:8020/day01/index.html') # 導入Select類 from selenium.webdriver.support.ui import Select # 創建Select對象 select = Select(wd.find_element_by_id("ss_multi")) # 清除所有已經選中的選項 select.deselect_all() # 選擇options2和options3 select.select_by_visible_text("options2") select.select_by_visible_text("options3")