Selenium - Css Selector 使用方法

什麼是Css Selector？

Css Selector定位實際就是HTML的Css選擇器的標籤訂位

工具

Css Selector能夠下載火狐瀏覽器插件，FireFinder 或 FireBug和FirePath組合使用。

 

使用方法：

1. Css Selector支持ID、Class的定位 與HTML中CSS定位相同

定位ID：id = "navi"  ->

 #navi

定位Class: class = "inner" ->

.inner

多個Class定位： class = " c1 c2 c3" -> 

.c1.c2.c3

2. Css Selector支持任意屬性定位

[name="name"]

3. Css Selector提供了標籤屬性組合定位

input[name="name"]

當與ID、Class 組合使用時書寫方式更爲簡單 

Class ->
input.c1
ID    ->
input#i1

4. Css Selector提供了多屬性組合過濾

select[size='4'][multiple='multiple']

5. Css Selector支持層級關係定位

div.inner>input
select>option[value='3']

 

6. Css Selector模糊匹配

以xx開始

[placeholder^='請經過ID'] 

以xx結束
[placeholder$='ID定位元素'] 

包含xx
[placeholder*='ID'] 

 

優勢：CSS選擇器語法比較簡潔，運行速度比較快。

缺點：不支持index定位

總結： 寫UI自動化時優先用Css Selector 選擇器，不能用在用Xpath 選擇器。