web自動化測試CSS定位

此種定位方式定位效率高,推薦使用

find_element_by_css_selector()

常用策略有5種

1. id 選擇器    說明  根據id屬性來選擇

格式  #id
     如  #user  選擇id屬性爲user的所有元素

       driver.find_element_by_css_selector("#user").click()


2. class選擇器   說明 前提必須有class屬性    根據class屬性來選擇

格式  .class 
     如  .Tel       //選擇class屬性值爲tel的所有元素

      driver.find_element_by_css_selector(".Tel").click()


3.元素選擇器   說明 根據元素的標籤名選擇      p 標籤 

格式  element   
    
如 input       // 選擇所有input元素

     driver.find_element_by_css_selector("input").click()          // 選擇所有的input標籤


4.屬性選擇器     說明: 根據元素的 屬性名稱和值 來選擇 
 

格式  [attribute=value]
   
如   [type="psword"]     //選擇所有屬性值爲password的值

    driver.find_element_by_css_selector([id='userA']).click() 


5.層級選擇器        說明 根據元素的父子關係來選擇

格式  element > element      > 可用空格代替
    如 p>input  // 返回所有p元素下所有的 input 元素

     driver.find_element_by_css_selector("p>input").click()          // 選擇p下面所有的input標籤

6.層級加屬性結合的方式

 driver.find_element_by_css_selector("p [type='pswd']").click()          // 選擇p下面屬性值[type='pswd']的標籤

 

7. CSS定位擴展

1).input[type^="a"]   說明 type屬性以a字母開頭的元素
2).input[type$="b"]   說明 type屬性以d字母結束的元素
3).input[type*="c"]    說明 type屬性包含c字母的元素

總結:

css選擇器 案例 說明
#id #user id選擇器  選擇id="user"的所有元素
.class .Tel class選擇器   選擇class="Tel"的所有元素
element input 選擇所有input標籤
[attribute=value] [type="pswd"] 選擇type="pawd"的所有元素   屬性的值要用單引號或雙引號
element>element p>input 選擇所有父元素爲p元素的input元素  可以用空格代替

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章