1 F12工具应用

以下以Chrome浏览器为例:

1.1 关上

  • 关上浏览器后,间接按“F12”

    # 1.2 调整显示地位
  • 如图:Dock side,有四种显示地位,别离为新窗口关上、居左、底部、居右显示

1.3 页面元素查看

  • 点击左上角的鼠标箭头后,鼠标挪动到页面的元素后,可查看具体的元素,如图中的“1”
  • 点击图中“2”图标,能够清空以后的元素
  • 如查看“百度一下”这个元素的属性,如下:

1.4 复制元素属性

  • 辨认到元素后,在对应的“Elements”中,鼠标右键,进行复制元素属性

  • 其中copy内容依据不同的元素显示会有区别,大体有以下几种意思:
Copy element:复制元素Copy outerHtml:复制指定标签及标签内的所有元素Copy selector:复制选择器Copy JS path:复制js门路Copy styles:复制款式Copy XPath:复制xpathCopy full XPath:复制残缺门路xpath,从html标签开始

2 selenium罕用定位和办法

2.1 xpath定位

2.1.1 关系定位(门路)

  • 定位子元素
//div/a
  • 定位子元素或后辈元素
//div//a
  • 父元素
//div/..
  • 最初一个子元素
//div/div[last()]
  • 第n个子元素
//div//tr[n]

2.1.2 元素属性

//div[@id='value']

2.1.3 层级+属性

//div/button/span[@id='value']

2.1.4 运算逻辑

//div/[@id='value' and @class='value']

2.1.5 文本定位

//div[text()='value']

2.1.6 罕用办法

  • 属性蕴含某字段
//div[contain(@属性,'value')]
  • 属性以某字段结尾
//div[start-with(@属性,'value')]
  • 属性以某字段结尾
//div[ends-with(@属性,'value')]
  • text中蕴含某字段
//div[contain(text(),'value')]

2.2 css selector定位

# css:选择器和申明# .class# #id# *# element# element>element# element1 element2# element1 element2:last-child# [attribute='value']# 属性蕴含某字段 //div[属性*=‘value’)]# 属性以某字段结尾 //div[属性^=‘‘value’)]# 属性以某字段结尾 //div[属性$=‘‘value’)]

2.3 两个办法

find_element(BY.xx,'值')办法find_elements(BY.xx,'值')办法
1、导入类:from selenium.webdriver.common.by import By
2、间接传递:id,name,XPath,CSS,如driver.find_element('id','xxx')
3、借助By来传递,如driver.find_element('By.ID,'xxx')