經常使用xpath選擇器和css選擇器總結

xpath選擇器

表達式	說明
article	選取全部article元素的全部子節點
/article	選取根元素article
article/a	選取全部屬於article的子元素的a元素
//div	選取全部div子元素（不論出如今文檔任何地方）
article//div	選取全部屬於article元素的後代的div元素，無論它出如今article之下的任何位置
//@class	選取全部名爲class的屬性
/article/div[1]	選取屬於article子元素的第一個div元素
/article/div[last()]	選取屬於article子元素的最後一個div元素
/article/div[last()-1]	選取屬於article子元素的倒數第二個div元素
//div[@lang]	選取全部擁有lang屬性的div元素
//div[@lang='eng']	選取全部lang屬性爲eng的div元素
/div/*	選取屬於div元素的全部子節點
//*	選取全部元素
//div[@*]	選取全部帶(任意)屬性的div元素
/div/a | //div/p	選取全部div元素的a和p元素
//span | //ul	選取文檔中的span和ul元素
article/div/p | //span	選取全部屬於article元素的div元素的p元素以及文檔中的全部span元素
//div[@id='1']/h1/text()	獲取id爲1的div標籤下的h1標籤裏的內容
//span[not(@class)]	選擇不包含class屬性的span節點
//span[not(@class) and not(@id)]	選擇不包含class和id屬性的span節點
//span[not(contains(@class,'expire'))]	選擇不包含class="expire"的span
//span[contains(@class,'expire')]	選擇包含class="expire"的span
//h2[contains(text(),'Activated')]	選擇標籤內容裏包含Activated的h2標籤
//div[not(contains(text(),'activated'))]	選擇標籤內容中不包含activated的div標籤

XPATH如何選擇不包含某一個屬性的節點

咱們知道選擇包含某一特定屬性的節點，可使用例如//tbody/tr[@class]來選擇。那麼不含某屬性的節點如何用xpath取得呢？

這裏能夠用到not。例如排除一個屬性的節點可使用//tbody/tr[not(@class)]來寫，排除一個或者兩個屬性可使用//tbody/tr[not(@class or @id)]來選擇。

css 選擇器

表達式	說明
*	選擇全部節點
# container	選擇id爲container的節點
.container	選取全部class 包含container的節點
li a	選取全部li下的全部a節點 （子節點）
ul + p	選擇ul後面的第一個p元素（兄弟節點）
div#container > ul	選取id爲container的div的第一個ul子元素
ul ~ p	選取與ul相鄰的全部p元素
a[title]	選取全部有title屬性的a元素
a[href="a.com"]	選取全部href屬性爲a.com值的a元素
a[href*="a"]	選取全部href屬性包含a的a元素
a[href^="http"]	選取全部href屬性值以http開頭的a元素
a[href$=".jpg"]	選取全部href屬性值以.jpg結尾的a元素
inupt[type=radio]:checked	選取狀態爲選中的radio元素
div:not(#container)	選取全部id不爲container的div元素
li:nth-child(3)	選取第三個li元素
tr:nth-child(2n)	第偶數個tr元素