1. 程式人生 > >關於webdriver元素定位的問題

關於webdriver元素定位的問題

今天終於解決了遺留很久的一個元素定位問題,非常感謝博友的博文幫助。

現在總結自己學習過程中瞭解到的元素定位方法,與大家分享,如有不全的地方請大家多多指教。

–id
–name
–class name
–link text
–partial link text
–tag name
–xpath
–css selector
例如我們開啟百度首頁,要獲取百度搜索框的元素定位,原始碼如下:

<input autocomplete="off" maxlength="255" value="" class="s_ipt" name="wd" id="kw">

1、by_id()
我們通過id 來獲取定位,程式碼如下:

driver=webdriver.Firefox()
driver.get('https://www.baidu.com/')
driver.find_element_by_id('kw').send_keys('哈哈哈')

2、by_name()
我們通過name來定位,程式碼如下:

driver=webdriver.Firefox()
driver.get('https://www.baidu.com/')
driver.find_element_by_name('wd').send_keys('哈哈哈')

3、by_class_name()
我們通過class name來定位,程式碼如下:

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

4、by_link_text()
當我們要定位的元素是超文字文字時,例如:

<a href="login/NewLogin/Logout">退出登入</a>

我們可以這樣定位:

driver.find_element_by_link_text('退出登入').click()

5、by_partial_link_text()
這是相對於上一種定位方式的模糊定位,只要填入的內容是頁面上唯一的,就可以定位到該元素,如:

driver.find_element_by_partial_link_text('退出'
).click()

6、by_tag_name()
標籤名定位,如在QQ登入頁面定位登入框,原始碼如下:

<input type="text" tabindex="1" value="" name="u" id="u" class="inputstyle">

定位程式碼如下:

#定位標籤為input的元素
driver.find_element_by_tag_name('input').send_keys('[email protected]')
#獲取頁面所有標籤為input的標籤,定位到第一個元素
driver.find_elements_by_tag_name('input')[0].send_keys('[email protected]')

當使用driver.find_elements_by_tag_name(‘input’)時,編譯器自動將所有input標籤看做是一個列表,讀取某一個input時需要指定元素下標。
7、by_xpath()
使用xpath定位是一個非常強大的定位方式,幾乎所有的元素都能使用這個方法定位到。如定位百度搜索框

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

這是正常的使用xpath最原始的方法。(也是最初學習時掌握的方法)

!!!以下這一段是從博友那裡copy過來的,方便閱讀
a. 用contains關鍵字,定位程式碼如下:
driver.findElement(By.xpath(“//a[contains(@href, ‘logout’)]”));
這句話的意思是尋找頁面中href屬性值包含有logout這個單詞的所有a元素,由於這個退出按鈕的href屬性裡肯定會包含logout,所以這種方式是可行的,也會經常用到。其中@後面可以跟該元素任意的屬性名。

b. 用start-with,定位程式碼如下:
driver.findElement(By.xpath(“//a[starts-with(@rel, ‘nofo’)]));
這句的意思是尋找rel屬性以nofo開頭的a元素。其中@後面的rel可以替換成元素的任意其他屬性。

c. 用Text關鍵字,定位程式碼如下:
driver.findElement(By.xpath(“//*[text()=’退出’]));
這個方法可謂相當霸氣啊。直接查詢頁面當中所有的退出二字,根本就不用知道它是個a元素了。這種方法也經常用於純文字的查詢。

另外,如果知道超連結元素的文字內容,也可以用
driver.findElement(By.xpath(“//a[contains(text(), ’退出’)]));
這種方式一般用於知道超連結上顯示的部分或全部文字資訊時,可以使用。
!!!以上一段是從博友那裡copy過來的,方便閱讀

8、by_css_selector
使用css定位也是非常強大的,並且相對xpath來說,css定位執行速度更快,程式碼如下:

#使用id定位
driver.find_element_by_css_selector('#kw').send_keys('python')
# #使用class定位
driver.find_element_by_css_selector('.s_ipt').send_keys('python')
#使用屬性定位
driver.find_element_by_css_selector('[autocomplete="off"]').send_keys('python')

以上是正常的使用css最原始的方法。(也是最初學習時掌握的方法)
這裡提一下之前我遇到的元素定位的問題,就是在定位頁面元素時,原始碼如下:

<button type="submit" class="btn radius size-L btn-danger" style="width: 100%;background-color:#c62b26">登 錄</button>

這個裡面既沒有id,也沒有name,起初我嘗試著用class_name來實行定位,但是返回定位不到元素,也嘗試過用link_text,,試著用學到的css方法來定位,按照class_name的方式,但返回是失敗的,因為這裡的class賦值(class=”btn radius size-L btn-danger),其中都多個字串組合而成,即使用了空格分隔,因此不能簡單的像之前那樣使用class_name定位,程式碼如下:

driver.find_element_by_css_selector('button.btn.radius.size-L.btn-danger').click()

程式碼解讀:先進入button標籤下,再找到btu->radius->size-L.btn-danger。

最後,能使用id /name儘量使用,不能再考慮使用css或xpath。
可以參考:https://www.cnblogs.com/qingchunjun/p/4208159.html

與君共勉!