随笔记录方便自己和同路人查阅。
#------------------------------------------------我是可耻的分割线-------------------------------------------
学习selenium自动化之前,最好先学习HTML、CSS、JavaScript等知识,有助于理解定位及操作元素的原理。关于python和selenium安装请自行搜索别的资料,
这里就不多做介绍了,所有例子均使用python3.6+selenium执行的。
#------------------------------------------------我是可耻的分割线-------------------------------------------
CSS定位
CSS(Cascading Style Sheets)是一种语言,它用来描述HTML和XML文档的表现。CSS使用选择器来为页面元素绑定属性。这些选择器可以被selenium用作另外的定位策略。
CSS可以较为灵活的选择空间的任意属性,一般情况下定位速度要比XPath快,但对于初学者来说学习起来稍微有点难度,下面我们就详细地介绍CSS的语法与使用。
选择器 |
例子 |
描述 |
.class |
.intro |
class选择器,选择class=’intro’的所有元素 |
#id |
#firstname |
Id选择器,选择id=’firstname’的所有元素 |
* |
* |
选择所有元素 |
element |
p |
所有<p>元素 |
Element > element |
div > input |
选择父元素为<div>的所有<input>元素 |
Element + element |
div + input |
选择同一级中紧接在<div>元素之后的所有<input>元素 |
[attribute=value] |
[target=_blank] |
选择target=’_blank’的所有元素 |
下面同样以百度输入框和搜索按钮为例介绍CSS定位的用法。
...
<span class=’bg s_ipt_wr’>
<input id=’kw’ class=’s_ipt’ sutocomplete=’off’ maxlength=’100’ value=’’ name=’wd’
</span>
<span class=’bg s_ipt_wr’>
<input id=’su’ class=’bg s_btn’ type=’submit’ value=’百度一下’
</span>
...
1)通过class属性定位:
find_element_by_css_selector(‘.s_ipt’)
find_element_by_css_selector(‘.bg s_btn’)
find_element_by_css_selector()方法用于CSS语言定位元素,点号(.)表示通过class属性来定位元素。
2)通过id属性定位:
find_element_by_css_selector(‘#kw’)
find_element_by_css_selector(‘#su’)
井号(#)表示通过id属性来定位元素
3)通过标签名定位:
find_element_by_css_selector(‘input’)
在CSS语言中,用标签名定位元素不需要任何符号标识,直接使用标签名即可。但我们前面已经了解了,标签名重复的概率非常大,所以通过这种方式很难找到想要的元素。
我们可以通过以下几种方式来使标签名查找方式生效:
1、通过父子关系定位:
find_element_by_css_selector(‘span>span’)
上面的写法表示有父亲,它的标签名为span,查找它的所有标签名交input的子元素
2、通过属性定位:
find_element_by_css_selector(“[autocomplete=off]”)
find_element_by_css_selector(“[name=’kw’]”)
find_element_by_css_selector(“[type=’submit’]”)
在CSS当中也可以使用元素的任意属性,只要这些属性可以唯一标识这个元素。对于属性值来说,可加引号,也可以不加,但注意和整个字符串的引号进行区分。
3、组合定位:
我们当然可以把上面的定位策略组合起来使用,这就大大加强了定位元素的唯一性。
find_element_by_css_selector(“span.bg s_ipt_wr>input.s_ipt”)
find_element_by_css_selector(“span.bg s_ipt_wr>input#su”)
有一个父元素,它的标签名叫span;它有一个class属性值叫bg s_ipt_wr;它有一个子元素,标签名叫inout,并且这个子元素的class属性值叫s_ipt。好吧,我们要找的就是具有这么多特征的一个子元素。