web自动化之元素定位

一、基础的元素定位

通过一个属性定位：
以百度浏览器为例：定位百度输入框
在浏览器上定位元素的操作方式：
按F12，点击左上角的箭头，呈绿色，再点击输入框，可看到 ，有一段代码input标签被高亮显示了，既定位到了。
可看到inpu标签，有id class name 属性，可利用这些元素进行元素定位。

1、通过id定位
2、通过name定位
3、通过class定位
4、通过xapth定位
5、通过css定位
代码实现：

from selenium import webdriver
import logging
import time
logging.basicConfig(level=logging.DEBUG)
# 启动浏览器驱动服务器
driver = webdriver.Chrome()
driver.get("https://www.baidu.com")
time.sleep(3)
# id定位百度输入框
# res = driver.find_element_by_id("kw")
# print(res)


# class 定位
# res = driver.find_element_by_class_name('s_ipt')
# print(res)


# name定位
# res = driver.find_element_by_name("wd")
# print(res)


# 通过css定位
res = driver.find_element_by_css_selector("#kw")
print(res)
res.send_keys("冬奥运动会")

# 点击百度
res2 = driver.find_element_by_id("su")
res2.click()

time.sleep(5)
# driver.close()
driver.quit()

补充：如何找到css 和 xPath相对路径和绝对路径
在定位到的元素标签上 右键->复制->

以上定位方式的区别：

共同点：只能通过一个属性定位
不同点：
1、find_element_by_id：通过id 定位元素
   （1）、id是唯一的，一般情况下id是给js用的
2、find_element_by_tag_name：通过标签名称定位元素
   （1）、标签名称不唯一
3、find_element_by_class_name：通过类名称定位元素(class')
   （1）、class 不唯一
   （2）、如果要通过class来定位，要确保你定位的这个元素class一定要唯一
4、find_element_by_name：通过元素name属性定位元素(需要元素有name属性)
   （1）、元素必须要有name属性
   （2）、name属性不一定唯一
5、find_element_by_link_text：a标签通过【精确匹配】超链接文本定位元素(超链接文本必须是唯一，不能有空格)
6、find_element_by_partial_link_text：a标签通过【模糊匹配】超链接文本定位元素(超链接文本必须是唯一)
可以通过多个属性组合定位
7、find_element_by_xpath：通过路径定位元素
   （1）、绝对路径定位【不用】
   （2）、相对路径定位【常用万能】

详解xpath定位

二、通过元素本身的属性来定位

1、标签名+属性名
一个条件：//input[@class=“s_ipt”]

多个条件：//input[@class=“s_ipt” and @id=“kw”]

定位到多个元素，通过索引取值，索引值从1开始：//input[@type=“hidden”][2]

2、标签名+文本定位
//a[text()=“新闻”]

3、标签名+contains()函数匹配部分属性值或文本内容定位
//a[contains(text(),“新闻”)]
通过模糊匹配，就匹配到2个：

4、标签名+多个属性组合定位，各种组合都可以，使用逻辑运算符and or
//a[@name=“tj_briicon” or contains(text(),“更多”)] 定位到2个

//a[@name=“tj_briicon” and contains(text(),“更多”)] 定位到1个
或者也可以这样写：
//a[@name=“tj_briicon” or text() = “更多”] 定位到2个
//a[@name=“tj_briicon” and text() = “更多”] 定位到1个

三、通过元素之间的关系来定位（轴定位）

1、层级定位
(1)只定位直接子节点 ：用一个/
eg:
//span[@id=“s_kw_wrap”]/input

(2)定位所有的孙子节点：
eg:
//div[@id=“s_fm”]//a

这样写定位到该div下边有5个a标签，要想具体定位到某一个：可在加属性
//div[@id=“s_fm”]//a[text()=“手写”]

2、轴名称1：ancestor: 祖先节点，包括父节点
eg:
通过3 永远可以相信团结一心的中国队，找 1 冰雪为融 共赴冬奥之约

//span[text()="永远可以相信团结一心的中国队"]/ancestor::ul/li//span[text()="冰雪为媒 共赴冬奥之约"]

3、轴名称2：parent: 父节点
//span[text()=“永远可以相信团结一心的中国队”]/parent::a/span[text()=“热”]

4、轴名称3：following:当前节点【之后】的所有节点
//div[@id=“viewClassDetailRoot”]//following::div[@id=“tab-2,8”]

5、轴名称4：preceding:当前节点【之前】的所有节点
//div[text()=“互动课件”]//preceding::div[@class=“bar-item active”]

6、轴名称5：following-sibling: 当前节点【之后】的所有兄弟节点
eg:
//div[text()=“测试”]/following-sibling::div[@aria-controls=“pane-7”]

7、轴名称6：preceding-sibling: 当前节点【之前】的所有兄弟节点
eg:
//div[text()=“测试”]/preceding-sibling::div[@aria-controls=“pane-1”]