Selenium+Python3的web自动化测试(二)

本文章内容参考了白夜黑羽教python的教程，出处为http://www.python3.vip/doc/tutorial/selenium/01/

感谢上方大佬！

所整理的正文如下：

 

首先，在搭建好Selenium+Python3的环境基础上，测试要点如下：

1.使用CSS Selector选择元素

 1 """用CSS Selector来代替id，class，tag查找"""
 2 
 3 #element = wd.find_element_by_id('animal')
 4 element = wd.find_element_by_css_selector('#animal')
 5 #注意用id方法查找需要加一个#号
 6 
 7 #elements = wd.find_elements_by_class_name('animal')
 8 elements = wd.find_elements_by_css_selector('.animal')
 9 #注意用class方法查找需要加一个.
10 
11 elements = wd.find_elements_by_tag_name('div')
12 elements = wd.find_elements_by_css_selector('div')
13 #用tag方法查找直接写tag名即可，与原tag查找方法相同

2.关于CSS Selecter选择子元素的语法

 1 #元素2是元素1的直接子元素，最终选择元素2
 2 元素1 > 元素2
 3 
 4 #后一个元素为前一个的直接子元素，最终选择元素4
 5 元素1 > 元素2 > 元素3 > 元素4
 6 
 7 #元素2是元素1的后代元素（后代元素包含直接子元素和间接子元素），中间是一个或者多个空格隔开，最终选择的元素是元素2
 8 元素1   元素2
 9 
10 #上一个的多层级选择表示方法（最终选择元素4）
11 元素1   元素2   元素3  元素4

3.根据属性选择CSS Selector

 1 #选择属性值herf为http://www.miitbeian.gov.cn 的元素
 2 element = wd.find_element_by_css_selector('[href="http://www.miitbeian.gov.cn"]')
 3 
 4 """选择属性值包含某个字符串的元素"""
 5 
 6 #比如， 要选择a节点，里面的href属性包含了 miitbeian 字符串
 7 a[href*="miitbeian"]
 8 
 9 #选择属性值以某个字符串开头的元素,比如,要选择a节点,里面的href属性以http开头
10  a[href^="http"]
11 
12 #选择属性值以某个字符串结尾的元素,比如,要选择a节点,里面的href属性以gov.cn结尾
13  a[href$="gov.cn"]
14 
15 #如果一个元素具有多个属性如  <div class="misc" ctype="gun">沙漠之鹰</div>
16 #可以指定 选择的元素要 同时具有多个属性的限制
17 div[class=misc][ctype=gun]

4.验证CSS Selector语法选择的是所需要选择的正确元素的快捷方法

举个栗子：

使用Chrome浏览器打开 http://f.python3.vip/webauto/sample1.html  ，按F12 打开 开发者工具栏

如果我们要验证 下面的表达式

 1 #bottom > .footer2 a 

能否选中  <a href="http://www.miitbeian.gov.cn">苏ICP备88885574号</a>

做法：

点击Elements 标签后， 同时按 Ctrl 键 和 F 键， 就会出现下图箭头处的 搜索框

 

 输入要验证的CSS Selector表达式，如果能选择到元素， 右边的的红色方框里面就会显示出类似 2 of 3 这样的内容。

of 后面的数字表示这样的表达式 总共选择到几个元素

of 前面的数字表示当前黄色高亮显示的是 其中第几个元素

上图中的 1 of 1 就是指：

CSS 选择语法 #bottom > .footer2 a

在当前网页上共选择到 1 个元素， 目前高亮显示的是第1个。

 

5.选择语法的联合使用

比如， 我们要选择 网页 html 中的元素 <span class='copyright'>版权</span>

 1 <div id='bottom'>
 2     <div class='footer1'>
 3         <span class='copyright'>版权</span>
 4         <span class='date'>发布日期：2018-03-03</span>
 5     </div>
 6     <div class='footer2'>
 7         <span>备案号
 8             <a href="http://www.miitbeian.gov.cn">苏ICP备88885574号</a>
 9         </span>
10     </div>        
11 </div>

那么CSS selector 表达式 有三种写法：

1 div.footer1 > span.copyright
2 #就是 选择 一个class 属性值为 copyright 的 span 节点， 并且要求其 必须是 class 属性值为 footer1 的 div节点 的子节点
3 
4 .footer1 > .copyright
5 #就是 选择 一个class 属性值为copyright 的节点（不限类型）， 并且要求其 必须是 class 属性值为 footer1 的节点的 子节点
6 
7 .footer1  .copyright
8 #因为子元素同时也是后代元素

6.同时选择多个元素（组选择）

 1 #同时选择所有class为plant和class为animal的元素（css选择器可以使用逗号，称之为组选择）
 2 .plant , .animal
 3 
 4 #同时选择所有tag名为div的元素 和 id为BYHY的元素
 5 div,#BYHY
 6 
 7 #对应的selenium代码如下
 8 elements = wd.find_elements_by_css_selector('div,#BYHY')
 9 for element in elements:
10     print(element.text)

7.但若在同一个属性下选中其中两个后代元素，注意写法（更换测试网址为：http://f.python3.vip/webauto/sample1a.html）

1 #要选择所有 唐诗里面的作者和诗名， 也就是选择所有 id 为 t1 里面的 span 和 p 元素
2 
3 #错误写法（这样写的意思是 选择所有 id 为 t1 里面的 span 和 所有的 p 元素）
4   #t1 > span,p    (这里#表示id方法)
5 
6 #正确写法
7   #t1 > span , #t1 > p      (这里#表示id方法)

8.按顺序选择子节点（测试网址为：http://f.python3.vip/webauto/sample1a.html）

 1   """父元素的第n个子节点"""
 2   #我们要选择唐诗和宋词的第一个作者，也就是说选择的是第2个子元素，并且是span类型
 3   span:nth-child(2) 
 4   #如果你不加节点类型限制
 5    :nth-child(2)
 6   #就是选择所有位置为第2个的所有元素，不管是什么类型
 7   
 8   """父元素的倒数第n个子节点"""
 9   #选择第倒数第1个子元素，并且是p元素
10  p:nth-last-child(1)
11  
12  """父元素的第几个某类型的子节点"""
13  #要选择 唐诗 和宋词 的第一个 作者,还可以这样思考，选择的是 第1个span类型 的子元素
14  span:nth-of-type(1)
15  
16  """父元素的倒数第几个某类型的子节点"""
17  p:nth-last-of-type(2)
18  
19  """奇数节点和偶数节点（假设是p类型的）"""
20  #选择的是父元素的 偶数节点
21  p:nth-child(even)
22  #选择的是父元素的 奇数节点
23  p:nth-child(even)
24  #选择的是父元素的 某类型偶数节点
25  p:nth-of-type(even)
26  #选择的是父元素的 某类型奇数节点
27  p:nth-of-type(even)
28  
29  
30  """兄弟节点选择"""
31  #相邻兄弟节点选择，用+号
32  #选择 唐诗 和宋词 的第一个 作者，可以选择 h3 后面紧跟着的兄弟节点 span
33  h3 + span
34  #后续所有兄弟节点选择，用~号
35  #选择 h3 后面所有的兄弟节点 span
36   h3 ~ span

9.使用XPath选择元素（目前XPath有1.0和2.0，浏览器支持的是1.0）

  • XPath验证元素的选择是否正确（也可以用这种方式来确定元素位置）用F12-->组合键 Ctrl + F，和CSS的验证方法相同。
  • 根节点用 "/" 表示，“/html”表示选择根节点下的html节点
  • 节点之间的分隔用 "/" 表示，“/html/body/div”表示选择html下body下的div元素（这个例子是绝对路径的表达方式）
  • XPath中的 "/" 类似CSS中的 ">"
  • 相对路径的表达方式：从当前节点往下寻找所有的后代元素如div，那么写为 “//div”
  • 相对路径的多层表达方式：
    • 要选择 所有的 div 元素里面的 所有的 p 元素 ，不管div 在什么位置，也不管p元素在div下面的什么位置，可以写为“//div//p”
    • 要选择 所有的 div 元素里面的 直接子节点 p，可以写为“//div/p”
  • 通配符为 " * "
  • 根据属性选择，格式为  [@属性名='属性值']   ，属性名前有@，属性值的引号可以是单引号也可以是双引号
  • 根据id属性选择：  //*[@id='west']
  • 根据class属性选择：  //select[@class='single_choice']   这是选择了所有select元素中class为single_choice的元素
  • 根据class属性选择时，如果一个元素有多个class元素如class='capital huge-city'，那么选这个属性时要把class内容写完整，不能只写其中一个
  • 根据其他属性选择： 比如选择 具有multiple属性的所有页面元素 ，写为 //*[@multiple]
  • 选择 style属性值 包含 color 字符串的 页面元素 ，可以这样 //*[contains(@style,'color')]
  • 选择 style属性值 包含 color 字符串的 页面元素 ，可以这样 //*[contains(@style,'color')]
  • 选择 style属性值 以 某个 字符串 结尾 的 页面元素 ，推测是 //*[ends-with(@style,'color')]， 但这是xpath 2.0 的语法 ，目前浏览器都不支持
  • 按次序选择，如选择的是 p类型第2个的子元素，写为  //p[2]
  • 按次序选择，如选取p类型倒数第1个子元素，写为  //p[last()]   ;   如选取p类型倒数第2个子元素，写为  //p[last()-1]
  • 按范围选择，如选取option类型第1到2个子元素，写为  //option[position()<=2] 或者  //option[position()<3] 
  • 按组选择(用 | 隔开多个表达式 )，要选所有的option元素 和所有的 h4 元素，写为  //option |  // h4
  • 选择父节点（本元素无特征和属性，但子节点有的情况下，可由子节点选到父节点，并且可继续选到父节点的父节点），某元素的父节点用 /.. 表示，如要选择 id 为 china 的节点的父节点，写为  //*[@id='china']/..
  • 选择兄弟节点
    • 后续兄弟节点，用语法 following-sibling::   如要选择 class 为 single_choice 的元素的所有后续兄弟节点 //*[@class='single_choice']/following-sibling::*     要选择后续节点中的div节点， 就应该这样写 //*[@class='single_choice']/following-sibling::div
    • 前面的兄弟节点，用语法 preceding-sibling:: 如，要选择 class 为 single_choice 的元素的所有前面兄弟节点 //*[@class='single_choice']/preceding-sibling::* 　　
     
 1 """选择示例网页中，id是china的元素,然后通过这个元素的WebElement对象，使用find_elements_by_xpath，选择里面的p元素"""
 2 
 3 # 先寻找id是china的元素
 4 china = wd.find_element_by_id('china')
 5 
 6 # 再选择该元素内部的p元素
 7 elements = china.find_elements_by_xpath('//p')
 8 
 9 # 打印结果
10 for element in elements:
11     print('----------------')
12     print(element.get_attribute('outerHTML'))
13 
14 #运行发现，打印的 不仅仅是 china内部的p元素， 而是所有的p元素。
15 #要在某个元素内部使用xpath选择元素， 需要 在xpath表达式最前面加个点，如下：
16 #elements = china.find_elements_by_xpath('.//p')

 

 

--end--

posted @ 2020-01-09 11:11  -Ruirui-  阅读(293)  评论(0)  编辑  收藏  举报