Web元素定位之CSS Selector

2021-07-27 15:12:32 字數 1949 閱讀 5486

target

css 3

xpath

所有元素

*//*

所有的p元素

p//p

所有的p元素的子元素

p > *

//p/*

根據id獲取元素

/轉義/#id

//*[@id= 『id』]

根據class獲取元素

.class

//*[contains(@class, 『class』)]

擁有某個屬性的元素

*[title]

//*[@title]

所有p元素的第乙個子元素

p > *:first-child

//p/*[0]

所有擁有子元素a的p元素

無法實現

//p[a]

下乙個兄弟元素

p + *

//p/following-sibling::*[0]

由於selenium使用xpath定位時採用遍歷頁面的方式,在效能上採用css選擇器的方式更優。xpath雖然效能指標較差,但是在瀏覽器中有比較好的外掛程式支援,定位元素比較方便,對於效能要求嚴格的場景,可考慮通過xpath改寫css的方式進行替換,比較以下2種方式:

div:nth-of-type(2) div ul li:nth-of-type(2) a

或者: #index>div:nth-of-type(2)>div>ul>li:nth-of-type(2)>a

實戰積累:

css=div:not(.hidden) div.resource-buttons
css=.dijitreset.dijitinline.dijitbuttontext:contains("join event")

css=a[href*='/scheduleddeployment/45d67'] 包含了

css=a[href^='/scheduleddeployment/45d67'] 以***開頭的

css=a[href$='/scheduleddeployment/45d67'] 以***結尾的

"x-btn-text module_picker_icon">...

可以這樣寫: css=button.x-btn-text.module_picker_icon

div+p: 緊接在 元素之後的所有 元素

p~ul: 前面有 元素的每個

番外篇:為什麼要自己寫xpath或css path

有人說,現在有了selenium ide自動錄製指令碼,我們根本不需要會xpath和css,但我要說的是雖然selenium ide會幫助自動識別元素,但其錄製的指令碼非常不穩定,回放失敗率極高:

以dojo框架實現的動態頁面為例,主要問題:

1. dojo框架所給出的各個控制項並不會像傳統的html標籤一樣,一旦**書寫完成就有固定的html id和html結構,dojo會自動為每個所使用的控制項建立一系列節點,並隨機給每個控制項乙個」控制項類別+順序號」的html id,這樣就給書寫selenium用例帶來了麻煩.

2. dojo框架提供的控制項使用的事件機制無法用普通的selenium ide錄製來完成,必須給以加工才可以使用,否則無法觸發實際控制項的動作。

3. dojo作為乙個ajax工具包,當然使用了ajax框架,所以web的行為具有非同步特徵,在進行事件的模擬(類似單擊下拉框進行選擇時)由於一般此種控制項的資料來源會在伺服器處獲得由此會產生乙個ajax呼叫,在此時直接執行單擊動作會無法找到相應節點(因為資料還木有返回,節點當然就無法生成),從而產生乙個element not found的錯誤而導致測試出錯.

想要學習xpath進行元素定位的童鞋,請移步:

selenium自動化測試之xpath網頁元素定位

Web自動化之元素定位

前提 元素或屬性必須唯一 八種元素定位方式 id,name,link text,partial link text,xpath,css,class name,tag name 1 id 定位 html規定id 是唯一標識 每個 id都是不一樣的 這類似公民的身份證號,具有很強的唯一性。定位 name...

web自動化測試之元素定位

貼吧 序號 方式 舉例 1通過id定位 driver.find element by id kw 2通過name定位 find element by name wd 3通過class定位 find element by class name s ipt 4通過xpath定位 find element...

web元素定位之 下拉框定位

下拉框定位,有兩種型別 第一種 select型別下拉框 select提供了三種選擇方法 select by index index 通過選項的順序,第乙個為 0 select by value value 通過value屬性 select by visible text text 通過選項可見文字 ...