UI自动化元素识别--css

• css_selector是什么?

　　CSS是一个被用来描述如何在屏幕等处渲染HTML和XML文档的语言。CSS使用选择器来为文档中的元素绑定样式属性。

　　选择器（selector）是用来在树中匹配元素的模式，选择器对HTML和XML进行了优化，被设计用来在注重性能的代码中执行。

　　Selenium官网的Document里极力推荐使用css_selector，而不是XPath来定位元素。

• Css_selector常用如下6种定位元素的方法：

1. 绝对路径
2. 相对路径
3. 元素属性
4. 元素属性值
5. 查询子元素绝对路径
6. 查询兄弟元素

# -*- coding: utf-8 -*-
# @Time : 2021/12/22 15:59
# @Author : Limusen
# @File : demo_ui_css

import time
from selenium import webdriver

driver = webdriver.Chrome()
driver.get("https://www.baidu.com")

# css通过元素在页面布局的位置定位    一切皆为框
# 使用空格来做分隔符，遇到class就使用 . 遇到id就使用 #

# # 1.绝对路径定位 定位到新闻
# driver.find_element_by_css_selector('html body div div div#s-top-left a').click()

# # 2. 相对路径定位 定位到hao123
# driver.find_element_by_css_selector('div#s-top-left.s-top-left-new.s-isindex-wrap a+a').click()
# # 2.1 输入内容再点击查询
# driver.find_element_by_css_selector('#kw').send_keys("hahahahah")
# driver.find_element_by_css_selector('#su').click()

# # 3.使用元素属性定位
# driver.find_element_by_css_selector("input[id='kw'][ name='wd']").send_keys("查一下宝儿")
# driver.find_element_by_css_selector("input[value='百度一下']").click()

# # 4.部分属性值匹配 http://www.hao123.com
# driver.find_element_by_css_selector('a[href="https://www.hao123.com"]').click()
# # 4.1 元素值开头包含内容： ^=
# driver.find_element_by_css_selector('a[href^="https://www.hao123"]').click()
# # 4.2 元素值结尾包含内容: $=
# driver.find_element_by_css_selector('a[href$="www.hao123.com"]').click()
# # 4.3 元素值中间包含内容 *=
# driver.find_element_by_css_selector('a[href*="https://www.hao123"]').click()

# # 5.查找子元素
# 5.1 查找第一个子元素 first-child
# driver.find_element_by_css_selector('div.s-top-left-new.s-isindex-wrap a:first-child').click()

# # 5.2 查找第n个子元素
# driver.find_element_by_css_selector('div#s-top-left a:nth-child(3)').click()
# driver.find_element_by_css_selector('div#s-top-left a:nth-child(6)').click()

# # 6.查询兄弟元素 
#   推荐使用5.2
driver.find_element_by_css_selector('div#s-top-left a+a+a+a').click()

time.sleep(2)
driver.quit()

• 识别元素By.xxx 进阶

# -*- coding: utf-8 -*-
# @Time : 2021/12/22 16:47
# @Author : Limusen
# @File : demo_ui_by_05


import time
from selenium import webdriver
from selenium.webdriver.common.by import By

# 识别元素进阶
driver = webdriver.Chrome()
driver.get("https://www.baidu.com")

# 将识别方法与识别属性分离开
driver.find_element(By.NAME, 'wd').send_keys("hahah")
# driver.find_element(By.CLASS_NAME,'s_ipt').send_keys("元素识别方法")
# driver.find_element(By.ID,'su').click()
# driver.find_element(By.PARTIAL_LINK_TEXT, 'hao').click()
# driver.find_element(By.CSS_SELECTOR,'#kw').send_keys("12306")

time.sleep(2)
driver.quit()