CSS表达式选择器
CSS Selector 语法选择元素原理为通过css样式进行选择
通过 CSS Selector 选择单个元素的方法是
find_element(By.CSS_SELECTOR, CSS Selector参数)
选择所有元素的方法是
find_elements(By.CSS_SELECTOR, CSS Selector参数)
elements = wd.find_elements(By.CSS_SELECTOR, 'div')
等价于（tag直接用）
elements = wd.find_elements(By.TAG_NAME, 'div')
id属性则需要加# (#id)
element = wd.find_element(By.CSS_SELECTOR, '#Id')
class属性则需要加. (.class)
elements = wd.find_elements(By.CSS_SELECTOR, '.animal')
如果 元素2 是元素1的直接子元素， CSS Selector 选择子元素的语法是这样的
元素1 > 元素2
# 中间用一个大于号 （我们可以理解为箭头号）
注意，最终选择的元素是 元素2， 并且要求这个 元素2 是 元素1 的直接子元素
也支持更多层级的选择， 比如
元素1 > 元素2 > 元素3 > 元素4
# 就是选择元素1里面的子元素元素2 里面的子元素元素3 里面的子元素元素4 ， 最终选择的元素是元素4
如果 元素2 是 元素1 的 后代元素， CSS Selector 选择后代元素的语法是这样的、
元素1 元素2
# 中间是一个或者多个空格隔开
# 最终选择的元素是 元素2 ， 并且要求这个 元素2 是 元素1 的后代元素。
也支持更多层级的选择， 比如
元素1 元素2 元素3 元素4
# 最终选择的元素是 元素4
如果 元素2 是 元素1 的 直接子元素， CSS Selector 选择子元素的语法是这样的
元素1 > 元素2
# 中间用一个大于号 （我们可以理解为箭头号）
注意，最终选择的元素是 元素2， 并且要求这个 元素2 是 元素1 的直接子元素
也支持更多层级的选择， 比如
元素1 > 元素2 > 元素3 > 元素4
# 就是选择 元素1 里面的子元素 元素2 里面的子元素 元素3 里面的子元素 元素4 ， 最终选择的元素是 元素4
如果 元素2 是 元素1 的 后代元素， CSS Selector 选择后代元素的语法是这样的
元素1 元素2
# 中间是一个或者多个空格隔开
# 最终选择的元素是 元素2 ， 并且要求这个 元素2 是 元素1 的后代元素。
也支持更多层级的选择， 比如
元素1 元素2 元素3 元素4
# 最终选择的元素是 元素4
<a href="http://www.miitbeian.gov.cn">苏ICP备88885574号</a>
可以用href值来选择
element = wd.find_element(By.CSS_SELECTOR, '[href="http://www.miitbeian.gov.cn"]')
前面可以加上标签名的限制，比如 div[class=‘SKnet’] 表示 选择所有 标签名为div，且class属性值为SKnet的元素。
属性值用单引号，双引号都可以。
根据属性选择，还可以不指定属性值，比如 [href] ， 表示选择所有具有属性名为href 的元素，不管它们的值是什么。
CSS 还可以选择 属性值包含某个字符串的元素
比如， 要选择a节点，里面的href属性包含了miitbeian字符串，就可以这样写
a[href*="miitbeian"]
还可以 选择 属性值 以某个字符串开头的元素
比如， 要选择a节点，里面的href属性以 http 开头 ，就可以这样写
a[href^="http"]
还可以 选择 属性值 以某个字符串 结尾 的元素
比如， 要选择a节点，里面的href属性以 gov.cn 结尾 ，就可以这样写
a[href$="gov.cn"]
如果一个元素具有多个属性
<div class="misc" ctype="gun">沙漠之鹰</div>
CSS 选择器可以指定选择的元素要同时具有多个属性的限制，像这样
div[class=misc][ctype=gun]
浏览器按F12 打开 开发者工具栏，按ctrl+F，
选择语法联用
选择 一个class 属性值为 copyright 的 span 节点， 并且要求其必须是 class 属性值为 footer1 的 div节点 的子节点
div.footer1 > span.copyright
# 或更简单
.footer1 > .copyright
组选择
同时选择所有class 为 plant 和 class 为 animal 的元素。
这种情况，css选择器可以使用 逗号 ，称之为组选择 ，像这样
.plant , .animal
再比如，我们要同时选择所有tag名为div的元素 和 id为BYHY的元素，就可以像这样写
div,#BYHY
对应的selenium代码如下
elements = wd.find_elements(By.CSS_SELECTOR, 'div,#BYHY')
按次序选择子节点
案例：
<body>
<div id='t1'>
<h3> 唐诗 </h3>
<span>李白</span>
<p>静夜思</p>
<span>杜甫</span>
<p>春夜喜雨</p>
</div>
<div id='t2'>
<h3> 宋词 </h3>
<span>苏轼</span>
<p>赤壁怀古</p>
<p>明月几时有</p>
<p>江城子·乙卯正月二十日夜记梦</p>
<p>蝶恋花·春景</p>
<span>辛弃疾</span>
<p>京口北固亭怀古</p>
<p>青玉案·元夕</p>
<p>西江月·夜行黄沙道中</p>
</div>
</body>
我们可以指定选择的元素是父元素的第几个子节点，使用 nth-child。
例：选择唐诗和宋词的第一个作者，也就是说选择的是第2个子元素，并且是span类型。所以这样可以这样写
span:nth-child(2)
选择的是父元素的倒数第几个子节点 ，使用 nth-last-child。
例：选择第倒数第1个子元素，并且是p元素。
p:nth-last-child(1)
指定选择的元素 是父元素的第几个某类型的子节点，使用 nth-of-type。
例：选择唐诗和宋词的第一个作者，还可以这样思考，选择的是第1个span类型的子元素，所以也可以这样写
span:nth-of-type(1)
选择父元素的倒数第几个某类型的子节点使用 nth-last-of-type。
p:nth-last-of-type(2)
如果要选择的是父元素的 偶数节点，使用 nth-child(even)
p:nth-child(even)
如果要选择的是父元素的 奇数节点，使用 nth-child(odd)
p:nth-child(odd)
如果要选择的是父元素的 某类型偶数节点，使用 nth-of-type(even)
如果要选择的是父元素的 某类型奇数节点，使用 nth-of-type(odd)
兄弟节点选择
相邻兄弟节点选择
上面的例子里面，我们要选择唐诗和宋词的第一个作者，就是选择 h3 后面紧跟着的兄弟节点 span。这就是一种相邻兄弟关系，可以这样写
h3 + span
# 表示元素紧跟关系的是加号。
后续所有兄弟节点选择
如果要选择是选择 h3 后面所有的兄弟节点 span，可以这样写
h3 ~ span
3691
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
