对元素的操作方法

# 点击元素
ele.click()# 输入文本
ele.send_keys("hello world")
# 上传图片
# input 标签可以直接使用 send_keys(文件地址) 上传文件
driver.get("https://image.baidu.com/")
driver.find_element(By.ID, "sttb").click()
driver.find_element(By.ID, "stfile").send_keys("/Users/lan/Pictures/7.jpeg")
sleep(10)# 获取元素的尺寸
ele.size
# 获取元素的坐标
ele.location
# 获取元素的文本（a 标签、p 标签或者 div 标签中的文本内容）
ele.text
# 获取元素属性值;通过属性名获取属性值
ele.get_attrbut("attr_name")

八大元素定位方式

1. id

import time
from selenium import webdriver
from selenium.webdriver.common.by import By# 1. 打开浏览器
driver = webdriver.Chrome()
# 2. 打开网址 -- 百度
driver.get("http://www.baidu.com")
# 3. 定位搜索框元素，输入搜索词
driver.find_element(By.ID, "kw").send_keys("Hello World!")
# 4. 点击搜索按钮
driver.find_element(By.ID, "su").click()
# 5. 验证结果
time.sleep(1)
assert driver.title == "Hello World!_百度搜索"
# 6. 退出浏览器
driver.quit()

2. name

# name="wd"
driver.find_element(By.NAME, "wd").send_keys("Hello World!")

3. class

该属性用于指定控件样式，很多情况下不唯一。

# class="s_ipt"
driver.find_element(By.CLASS_NAME, "s_ipt").send_keys("Hello World!") 

4. tag & 定位组元素

HTML中一个tag往往用来定义一类元素的功能，页面元素较多，很难通过tag区分。

# 如果页面有多个 input 标签，那么会自动与第一个元素进行交互
driver.find_element(By.TAG_NAME, "input").send_keys("Hello World!")
# 出现报错：元素不可交互
# 原因是百度首页第一个 input 标签并不是可见的

由于百度首页有多个input标签，这里就需要通过 find_elements来获取整组元素，按元素下标精准定位。

# 按下标取元素，取第 8 个
driver.find_elements(By.TAG_NAME, "input")[7].send_keys("Hello World!")

注意：当页面有更新，根据 tag 定位的元素不一定可靠，所以一般不单独用tag定位，更多是用于组合定位。

5. link

通过带有链接的文本进行定位。

# 通过「关联 herf 标签的文本」定位driver.find_element(By.LINK_TEXT, "关于百度").click()

6. partial link

针对带有链接的文本，模糊匹配。当需要定位的文本过长，支持根据其中一部分文本进行定位，但需要保证模糊匹配的唯一性。

# 定位的也是「关于百度」
driver.find_element(By.PARTIAL_LINK_TEXT, "关于").click()

7. Xpath

XML Path Language

• 用于解析 html 和 xml
• 支持 appium 和 selenium
• 缺点是查找慢

`/`  是在当前目录的子目录下查找
`//` 是在当前目录的子子孙孙目录下查找
`[]` 表示需要满足的条件

百度页面示例

// 进入百度页面，点击检查，进入 Console
clear() // 清空当前屏幕// 练习 1: 通过 xpath 查找输入框
// name 和 id 通常都是唯一的，通过该属性可以直接定位
$x('//*[@name="wd"]')
$x('//*[@id="kw"]')// 练习 2: 查看搜索框下面的「网页」tab 栏
// 在 b 标签下
$x('//*[@id="s_tab"]//b')// 练习 3: 查看搜索框下面的其他 tab 栏
// 共 9 个, 都是在 a 标签下
$x('//*[@class="s_tab_inner"]//a[1]')
$x('//*[@class="s_tab_inner"]//a[9]')
// 直接定位到最后一个
$x('//*[@class="s_tab_inner"]//a[last()]')
// 定位到最后第二个
$x('//*[@class="s_tab_inner"]//a[last()-1]')// 练习 4: 定位右上角设置和登录按钮
$x('//*[@id="u1"]/span')  // 设置
$x('//*[@id="u1"]/a')    // 登录

# 在 console 调试好表达式后，直接在代码中使用
driver.find_element(By.XPATH, '//*[@name="wd"]').send_keys("Hello World!")

8. Css Selector

• appium 原生的控件不支持该方式定位
• selenium 支持
• webview 推荐这种定位方式，更简洁

.test  // 选择 class="test" 的所有元素
#test  // 选择 id="test" 的所有元素
*      // 选择所有元素// 空格代表子子孙孙全部元素
p      // 代表选择所有 
 元素
div,p  // 代表选择所有 
 和 
 元素
div>p  // 选择父元素为 
 元素的所有 
 元素
div+p  // 选择紧接在 
 元素之后的所有 
 元素[id=kw]        // 选择 id="kw" 的所有元素
p:nth-child(2) // 选择父元素第 2 个子元素
p~ul           // 选择前面有 
 元素的每个 
 元素 

// 练习 1 查找搜索框，进入搜索结果页
$("#kw")      // 方法一
$("[id=kw]")  // 方法二// 练习 2 查找「网页」tab
$("#s_tab b")// 练习 3 查看「资讯」tab
$("#s_tab :nth-child(2)")  # 练习4 查看最后一个 tab
$("#s_tab a:nth-last-child(1)")  # 最后一个元素
$("#s_tab a:nth-last-child(2)")  # 最后第二个元素

driver.find_element(By.CSS_SELECTOR, '#kw').send_keys("Hello World!")