1. 程式人生 > 其它 >UI自動化-元素定位方法

UI自動化-元素定位方法

1、id定位:find_element_by_id()

從上面定位到的搜尋框屬性中,有個id="kw"的屬性,我們可以通過這個id定位到這個搜尋框

# 開啟百度首頁
# 啟動瀏覽器
driver = webdriver.Chrome(executable_path=driverfile_path)
# 開啟百度首頁
driver.get(r'https://www.baidu.com/')
# 通過id定位搜尋框,並輸入selenium
driver.find_element_by_id('kw').send_keys('selenium')

2、name定位: find_element_by_name()

從上面定位到的搜尋框屬性中,有個name="wd"的屬性,我們可以通過這個name定位到這個搜尋框

# 通過name定位搜尋框,並輸入selenium
driver.find_element_by_name('wd').send_keys('selenium')

3、class定位:find_element_by_class_name()

從上面定位到的搜尋框屬性中,有個class="s_ipt"的屬性,我們可以通過這個class定位到這個搜尋框

# 通過name定位搜尋框,並輸入selenium
driver.find_element_by_class_name('s_ipt').send_keys('selenium')

4、tag定位:find_element_by_tag_name()

如果懂HTML知識,我們就知道HTML是通過tag來定義功能的,比如input是輸入,table是表格,等等...。每個元素其實就是一個tag,一個tag往往用來定義一類功能,我們檢視百度首頁的html程式碼,可以看到有很多div,input,a等tag,所以很難通過tag去區分不同的元素。基本上在我們工作中用不到這種定義方法,僅瞭解就行

# 通過tag定位搜尋框,並輸入selenium, 此處必報錯
driver.find_element_by_tag_name('input').send_keys('selenium')

5、link定位:find_element_by_link_text()

此種方法是專門用來定位文字連結的,比如百度首頁右上角有“新聞”,“hao123”,“地圖”等連結

# 通過link定位"新聞"這個連結並點選
driver.find_element_by_link_text('新聞').click()

6、partial_link定位:find_element_by_partial_link_text()

有時候一個超連結的文字很長很長,我們如果全部輸入,既麻煩,又顯得程式碼很不美觀,這時候我們就可以只擷取一部分字串,用這種方法模糊匹配了。

我們用這種方法來定位百度首頁的“新聞”超連結

# 通過partial_link定位"新聞"這個連結並點選
driver.find_element_by_partial_link_text('聞').click()

7、xpath定位:find_element_by_xpath()

前面介紹的幾種定位方法都是在理想狀態下,有一定使用範圍的,那就是:在當前頁面中,每個元素都有一個唯一的id或name或class或超連結文字的屬性,那麼我們就可以通過這個唯一的屬性值來定位他們。

但是在實際工作中並非有這麼美好,有時候我們要定位的元素並沒有id,name,class屬性,或者多個元素的這些屬性值都相同,又或者重新整理頁面,這些屬性值都會變化。那麼這個時候我們就只能通過xpath或者CSS來定位了。


driver.find_element_by_xpath("//*[@id='kw']").send_keys('selenium')

//*input[@name="key"]

#元素定位-聯合多個屬性共同定位,邏輯表示式 -And查詢

//*[@id="searchKey" and @name="key"]

#邏輯表示式 -Or查詢

//book[@category=”web” or @cover=”paperback”]

#邏輯表示式 -非查詢控制元件

//book[@category!=”web”]

#邏輯表示式 -Not查詢

//year[not(.=2005)] 意思是:查詢year內容不為2005的內容 注:“.”就等於text()
//book[not(@category=”children”)]

#元素定位-XPATH屬性+標籤+索引
//form/span[1]/inputsubstring(@class,3)='ipt']
模糊匹配
//form/span[1]/input[contains(@class,'ipt')]
//input[startwith]

精確匹配
//input[@value="查一下"]

查詢book物件

//book #所有的數

//book[1] #第一本書

//book[last()] 倒數第一本:

//表示從目錄任意位置查詢,/表示按照目錄順序查詢

倒數第二本://book[last()-1]

針對同一個元素下面多個相同的子標籤和元素,如何定位多胞兄弟
//第一個元素 標籤:first-chlid 如:a:first-chlid
//第二個或者n個元素 標籤:nth-chlid(n) 如:a:nth-child(n)
//最後元素 標籤:last-of-type

8、CSS定位
被測試的html程式碼:

#使用絕對路徑,根據層級定位,層級定位通過>或者空格隔開

CSS定位表示式:html>body>div>input[type='button']

webElement searchBox=driver.findElement(By.cssSelector("html>body>div>input[type='button']"))

#根據其他屬性定位,則[屬性值],如:
webElement searchBox=driver.findElement(By.cssSelector("input[type='button']"))
webElement searchBox=driver.findElement(By.cssSelector("input[value='查詢']"))

根據id定位 使用#id屬性值 如:"input#kw"
webElement searchBox=driver.findElement(By.cssSelector("input#div1input"))

定位獲取多個元素:
elist=driver.find_element_by_css_selector("input#kw")

#根據class定位,使用.class屬性值,如:"input.s_ipt"
webElement searchBox=driver.findElement(By.cssSelector("input.spread"))

使用頁面其他屬性值定位:

被測試網頁中,查詢div標籤中第一張圖片

CSS定位表示式:img[alt='div1-img1'][href='http://www.sogou.com']

定位語句:

  webElement searchBox=driver.findElement(By.cssSelector("img[alt='div1-img1'][href='http://www.sogou.com']"))

使用頁面元素屬性值的一部分關鍵字定位

CSS定位表示式:a[href^='http://www.so'];表示匹配連結地址開頭含有關鍵字的連結

a[href$='fou.com'];表示匹配連結地址結尾含有關鍵字的連結

a[href*='so'];表示匹配連結地址包含有關鍵字的連結

webElement searchBox=driver.findElement(By.cssSelector("a[href^='http://www.so']"))

webElement searchBox=driver.findElement(By.cssSelector("a[href$='fou.com']"))

webElement searchBox=driver.findElement(By.cssSelector("a[href*='so']"))

使用頁面元素進行子頁面元素的查詢

CSS定位表示式:div#div1 > input#div1input
webElement searchBox=driver.findElement(By.cssSelector("div#div1 > input#div1input"))

使用偽類定位元素
被測試網頁中,查詢第一個div下的指定子頁面元素

div#div1:first-child ;查詢id為div1的div頁面元素下第一個元素。

div#div1:nth-child(2) ;查詢id為div1的div頁面元素下的第二個元素。

div#div1:last-child ;查詢id為div1的div頁面元素下的最後一個元素。
webElement searchBox=driver.findElement(By.cssSelector("div#div1:first-child"))
webElement searchBox=driver.findElement(By.cssSelector("div#div1:nth-child(2)"))
webElement searchBox=driver.findElement(By.cssSelector("div#div1:last-child"))
查詢同級兄弟頁面元素
#表示ID屬性值為div1的div頁面元素下,查詢input頁面元素後面的同級連結元素
CSS定位表示式:div#div1 > input +a ;

#表示ID屬性值為div1的div頁面元素下,查詢input頁面元素和連結元素後面的同級圖片元素
CSS定位表示式:div#div1 > input+a+img;
#表示ID屬性值為div1的div頁面元素下,查詢input頁面元素和某種型別頁面元素後面的同級圖片元素,*表示任意型別的頁面元素。
CSS定位表示式:div#div1 > input + * +img ;