定位元素规则

CSS selector:
基本选择
by class name '.plant'
by tagname 'span'
by id '#search'

选择子元素和后代元素
子元素
元素1 > 元素2

后代元素
元素1 元素2

#container > div
#layer1 span

根据属性选择
[href='xxxxx']
['href']

组合属性选择
.plant[name='sknet']

组合之间或的关系
.plant , .animal

按照次序选择
父元素的第N个子节点
：nth-child

span:nth-child(2)
父元素的倒数第N个子节点
span:nth-last-child(2)

父元素的第几个某类型的节点
nth-of-type
span:nth-of-type(2)

父元素的倒数第几个某类型的子节点
nth-last-of-type

奇数 偶数节点的选择
偶数： even
奇数： odd

例如 p:nth-child(even)

兄弟节点选择
相邻兄弟节点选择 + 
h3 + span

后续所有兄弟节点选择 ~
h3 ~ span

属性值包含关系
包含 *=
以...开头^=
以...结尾$=

Xpath选择器
根据属性选择
*[@属性名=‘属性值’]
//*[@id='west']

属性值包含关系
包含 contains 
//*[contains(@style,'color')]
以...开头 starts-with
//*[starts-with(@style,'color')]
以...结尾 ends-with(xpath 2.0才支持)

选取某类型的第N个元素
//p[2]得到p类型的第二个元素

倒数第一个是
//p[last()]

倒数第二个
//p[last()-1]

范围选择
选取option类型前2个
//option[position()<=2]

选取option类型后三个
//option[position()>last()-3]

组选择
//option | //h3

选择父节点
某个元素的父节点用/..表示

兄弟节点
following-sibling::
//select[@class='single_choice']/following-sibling::hr

前面的兄弟节点
preceding-sibling::