css selector定位元素

2021-08-06 05:04:45 字數 1845 閱讀 6055

selenium中經常要用css selector定位元素,雖說可以用firefox的firebug&firepath直接copy元素的xpath路徑,但有時還是很必要用css selector來定位,也算技多不壓身吧~~系統的學習一下,也當是臨陣磨槍。

一共8種方式的選擇器。

根據元素的標籤定位,如下:

okbutton>
selenium舉例:

(by.css_selector,『button』)

by.tag_name(『button』)

根據元素的class屬性來定位,

selenium舉例:

(by.css_selector,『.important』),會返回標題&段落兩行;

(by.css_selector,『.important.warning』),多類選擇器,只會定位到段落一行

by.class_name(『important』)

根據元素的id屬性來定位,

selenium舉例:

(by.css_selector,『#intro』);

by.id(『intro』)

注意:id在乙個html中唯一,id屬性區分大小寫

根據元素的屬性定位:

is a very important warning.

selenium舉例:

(by.css_selector,『p[class=」import warning」]』)

屬性與屬性的值需要完全匹配,如上面用p[class=』impprtant』]就定位不到;

部分屬性匹配:(by.css_selector,『p[class~=」import warning」]』);

子串匹配&特定屬性匹配:

[class^=」def」]:選擇 class 屬性值以 「def」 開頭的所有元素

[class$=」def」]:選擇 class 屬性值以 「def」 結尾的所有元素

[class*=」def」]:選擇class 屬性值中包含子串 「def」 的所有元素

[class|=」def」]:選擇class 屬性值等於「def」或以「def-」開頭的元素(這個是特定屬性匹配)

選擇某個元素的後代的元素:

selenium舉例:

(by.css_selector,『div button』),div元素的所有的後代元素中標籤為button元素,不管巢狀有多深;

選擇某個元素的子代元素:

selenium舉例:

(by.css_selector,『div > button』),div元素的所有的子代元素中標籤為button元素(>符號前後的空格可有可無)

乙個元素不好定位時,它的兄長元素很起眼,可以借助兄長來揚名,因此不妨稱之為「弟弟選擇器」,即選擇某個元素的弟弟元素(先為兄,後為弟):

selenium舉例:

(by.css_selector,『button + li』),button與li屬於同一父元素,且button與li相鄰,選擇button下標籤為li的元素

這是個段落p>

intert keyli>

turn keyclockwisestrong>

li>

push acceleratorli>

ul>

selenium舉例:

(by.css_selector,『ul li:nth-child(3)』),ul元素的後代元素中,有多個標籤為li的元素,選擇這些li元素中的第3個

注意,html中必須宣告才能使用-child這種偽類;偽類選擇器不區分大小寫

references:

CSS Selector定位元素

滴 今日打卡!博主之前寫過一篇關於xpath元素定位的部落格,裡面也有提到過xpath方法和css選擇器方法的比較 今天就補上css選擇器定位筆記。1.css選擇器定位元素 1 標籤選擇器 driver.find element by css selector li 選擇所有 li標籤元素 2 類選...

根據css selector定位元素的幾種方法

最方便快捷的用瀏覽器複製的css引數可以定位 find element by css selector css selector引數 選擇多個css元素 find elements by css selector css selector引數 此外css選擇器也可以根據tag名 id class.後...

selenium xpath定位元素

xpath獲取 f12開啟瀏覽器除錯視窗,找到元素對應html 右鍵 copy copy xpath xpath 是xml的查詢語言,和sql的角色很類似。以下面xml為例,介紹xpath 的語法。empire burlesque bob dylan 10.90 hide your heart bo...