Web控件定位与常见操作

常见操作

1.点击按钮2.在输入框中输入内容

定位：id和name是我们最常用的定位方式, 因为大多数空间都有这两个属性, 而且在对控件的id和name命名时一般使其有意义也会取不同的名字, 通过这两个属性定位一个属性变得比较容易

还有一种是利用元素属性来进行xpath定位，搜索框还可以利用id和name属性去定位。

chrome浏览器进行元素定位技巧

1.打开Chrome浏览器的开发者工具,右击点检查或快捷键：fn+F12

浏览器右上角的菜单按钮，选择更多工具>开发者工具

css调试

$$("css表达式")
​

xpath调试

$x("xpath表达式")
​

八大要素

1. id定位：

   页面元素的唯一标识

   driver.find_element(By.ID,'search-button')

2. class定位

   1.1.获取元素的class 属性

   1. 为网页内的某个元素指定一个css样式来更改该元素的外观

   根据元素的样式class值来获取元素,可能返回元素集合,

   driver.find_element(By.CLASS_NAME,'icon btn-flat')

3. Name定位

   1.name属性定位

   2.使用元素的id和name属性进行定位，定位速度比较快。 其实就是用的css选择器来完成定位。

   driver.findElement(By.name("wd"))

4. Tagname定位

   tagName,标签名,用的很少,一般页面会重复

5. xpath定位

XPath是一种在XML文档中定位元素的语言，HTML可以看做XML的一种实现，xpath就是一个path「路径」用来描述元素位置信息的路径,相当于元素的坐标。

5.1绝对路径定位

XPath主要用标签名的层级关系来定位元素的绝对路径，最外层为html语言。在body文本内，一级一级往下查找，如果一个层级下有多个相同的标签名，那么就按上下顺序确定是第几个，div[2]表示当前层级下的第二个div标签。

/html / body / section / div / div[1] / header / div / div / div[2] / ul / li[1] / a / svg

绝对路径以单个/表示,而且是让解析引擎从文档的根节点开始,也就是html这个节点下开始解析

5.2利用元素属性定位

不是/开头的就是相对路径，相对路径以//表示,表示从匹配选择的当前节点选择文档中的节点，而不考虑它们的位置。

• //

  • 匹配指定节点

• *

  • 通配符,匹配任意元素节点

• @

  • 选取属性

• []

  • 属性判断条件表达式

    例：

driver.find_element(By.XPATH,'//*[@id="search-button"]').click()

//*表示选取文档中的全部元素

[]表示属性判断条件表达式

@选取属性

id表示选取ID属性

click()表示点击

driver.find_element(By.XPATH,'//a[@id="search-button"]').click()

//a表示选取a标签

driver.find_element(By.XPATH,'// input[@id ="searchterm"and@autocomplete="off"]').send_keys("selenium")

//input表示input类

// input[@id ="searchterm"and@autocomplete="off"]表示多个属性拼接

send_keys("selenium")表示发送selenium信息

6.css定位(用的很少)

driver.find_element(By.CSS_SELECTOR,'#search-term').send_keys("selenium")

‘#search-term’表示ID元素

7.linkText定位

基于超链接文本内容定位,equal，精确查询，字要输全

driver.find_element(By.LINK_TEXT,"搜索").click()

8.partial_link定位

超链接部分文本,仅适用于超链接a元素，只适用于a标签。

基于部分超链接文本内容。 contains，模糊查询，只用输入想输入的一部分就行。

driver.find_element(By.PARTIAL_LINK_TEXT,"搜")