Python+Selenium - Web自動化測試（二）：元素定位

前言

前面已經把環境搭建好了，現在開始使用 Selenium 中的 Webdriver 框架編寫自動化代碼腳本，我們常見的在瀏覽器中的操作都會有相對應的類方法，這些方法需要定位才能操作元素，不同網頁的元素也不同，可以根據自己情況選擇使用不同的類方法。下面開始學習元素定位；

第一步在項目文件夾中創建一個Python包文件夾：

第二步New一個后綴為.py的Python文件寫一段代碼，先感受一下代碼吧！寫完以后Ctrl+Shift+F10運行代碼：

# -*- coding:utf-8 –*- 
from selenium import webdriver # 從selenium模塊中導入webdrive類 
 driver = webdriver.Chrome() # 定義新的變量名,打開瀏覽器 
 driver.maximize_window() # 瀏覽器窗口最大化 
 driver.get("https://baidu.com") # 打開百度網址 

# 定位百度首頁的搜索框,然后在搜索框中輸入Selenium  driver.find_element_by_id('kw').send_keys('Selenium') 
# 定位百度首頁的百度一下,然后點擊一下  driver.find_element_by_id('su').click() 

瀏覽不同的網頁元素也不同，可以選擇使用最合適你的情況的方法使用，下面介紹Selenium其中的16種定位方法：

WebDriver8種基本元素定位方式：

id定位：find_element_by_id(self, id_) name定位：find_element_by_name(self, name) class定位：find_element_by_class_name(self, name) tag定位：find_element_by_tag_name(self, name) link定位：find_element_by_link_text(self, link_text) partial_link定位：find_element_by_partial_link_text(self, link_text) xpath定位：find_element_by_xpath(self, xpath) css定位：find_element_by_css_selector(self, css_selector）

這8種其實和上面的8種一樣的只不過后者是以復數形式出現(這些復數定位方法會返回一個列表的值)：

id復數定位：find_elements_by_id(self, id_) name復數定位：find_elements_by_name(self, name) class復數定位：find_elements_by_class_name(self, name) tag復數定位：find_elements_by_tag_name(self, name) link復數定位：find_elements_by_link_text(self, text) partial_link復數定位：find_elements_by_partial_link_text(self, link_text) xpath復數定位：find_elements_by_xpath(self, xpath) css復數定位：find_elements_by_css_selector(self, css_selector)

8種基本定位介紹，掌握這8種基本可以橫着走了！

以百度為例這張圖是百度輸入框的，一眼看過去就看到了三種定位方式：

1. 通過id定位：

 

driver.find_element_by_id('kw').send_keys('Selenium')

2. 通過name定位：

driver.find_element_by_name('wd').send_keys('Selenium')

3. 通過class定位：

driver.find_element_by_class_name('s_ipt').send_keys('Selenium')

4. 通過tag定位：

tag其實是通過標簽名去定位的，一般情況下一個頁面會存在大量相同的標簽名這種定位方式不是很實用，所以用的也就比較少；

driver.find_element_by_tag_name('input').send_keys('Selenium')

5. 通過link_text定位：

HTML代碼中以a標簽開頭的一般是超鏈接元素的標記可以使用link_text可以精准匹配；

<a href="http://news.baidu.com" name="tj_trnews" class="mnav">新聞</a>

driver.find_element_by_link_text('新聞').click()

6. 通過partial_link_text定位：

這種定位方式和上面的一樣也是通過HTML的a標簽定位，唯一不同的這種方式是模糊匹配，當超鏈接名稱過長時，這時候可以使用模糊匹配方式，截取其中一部分字符串就可以了；

driver.find_element_by_partial_link_text('聞').click()

7. 通過xpath定位：

xpath是XML路徑語言，它可以用來確定xml文檔中的節點元素位置，通過元素的路徑來完成對元素的查找。HTML就是XML的一種實現方式，可以自行選擇絕對路徑和相對路徑作為匹配的路徑

雙斜杠(//) = 相對路徑，可以選擇任何一個節點作為起始點

單斜桿(/) = 絕對路徑，就是從網頁代碼的html開始一層一層找

(*)= 匹配任何元素節點；(@*)= 匹配任何屬性節點

1. xpath可以使用id，name，class元素進行定位：
   

   
   

   # 使用xpath方法的id屬性定位
   driver.find_element_by_xpath("//*[@id='kw']").send_keys('Selenium')

   # 使用xpath方法的name屬性定位
   driver.find_element_by_xpath("//*[@name='wd']").send_keys('Selenium')

   # 使用xpath方法的class屬性定位
   driver.find_element_by_xpath("//*[@class='s_ipt']").send_keys('Selenium')

2. 除了使用class，id，name定位，也可以手動選取節點來進行定位：

   

   # 使用 // 選取當前節點
   driver.find_element_by_xpath("//input[@id='kw']").send_keys('Selenium')

   # 使用 // 選取父節點
   driver.find_element_by_xpath("//span[@class='bg s_ipt_wr quickdelete-wrap']/input").send_keys('Selenium')

   # 使用 // 選取爺節點
   driver.find_element_by_xpath("//form[@id='form']/span[1]/input").send_keys('Selenium')

3. 使用絕對路徑定位代碼會很長，有其中一個元素發生變化就會失效。還有就是程序在運行的時候會檢索會比較慢，剝絲抽繭一層層的找會很慢，不建議使用；
   

   
   

   
   

   driver.find_element_by_xpath('html/body/div[1]/div[1]/div/div[1]/div/form/span[1]/input').send_keys('Selenium')

8. 通過css定位：

1. css也頗為強大xpath可以干的事css也可以干，css的語法更為簡潔，更為高效。而相對初學者xpath看起來更直觀，更好理解；
   （ ps：css的寫法相對有些特殊，需要對css有一定的了解才能理解寫法 ）
   
   

   # 使用 css 通過 id 定位
   driver.find_element_by_css_selector('#kw').send_keys('Selenium')

   # 使用 css 通過 class 定位
   driver.find_element_by_css_selector('.s_ipt').send_keys('Selenium')

   # 使用 css 通過 name 定位
   driver.find_element_by_css_selector("[name='wd']").send_keys('Selenium')

   # 使用 css 通過 autocomplete 定位
   driver.find_element_by_css_selector("[autocomplete='off']").send_keys('Selenium')

2. css除了使用元素的屬性定位也可以和xpath一樣使用層級關系進行定位：
   
   

   # 使用 css 通過 標簽定位

   driver.find_element_by_css_selector('input').send_keys('Selenium')

   # 使用 css 標簽屬性定位

   driver.find_element_by_css_selector('input.s_ipt').send_keys('Selenium')

   driver.find_element_by_css_selector('input#kw').send_keys('Selenium') #

   # 層級關系

   driver.find_element_by_css_selector("input[id='kw']").send_keys('Selenium')

   driver.find_element_by_css_selector("input[name='wd']").send_keys('Selenium')

   driver.find_element_by_css_selector("input[autocomplete='off']").send_keys('Selenium')

   # 層級關系

   driver.find_element_by_css_selector("form#form>span>input").send_keys('Selenium')

   driver.find_element_by_css_selector("form.fm>span>input").send_keys('Selenium')

   driver.find_element_by_css_selector("form[name='f']>span>input").send_keys('Selenium')

本章說的是8種基本定位的方法，學會了8種基本可以滿足日常使用了，其中xpath和css的定位方法遠遠不止我寫的幾種，想要深入了解xpath、css、復數定位的請訪問Selenium的官方網站瀏覽相關的說明文檔或者自行上度娘查找學習。

 

＂記錄＂是見證成長；＂成長＂則意味着蛻變；“變＂，創造無限可能。