UI自动化之元素定位(xpath、css) UI自动化之元素定位(xpath、css)

　　很早之前就已经写过自动化了，不过点着功能久了就会容易忘记元素定位，尤其是xpath和css定位，所以就花点时间做下总结收集。

xpath有两种定位：

一.绝对路径（不推荐使用，除非已经使用了所有方式仍然无法定位）
方法：根据实际目录，逐层输写。
例子： find_element_by_xpath("/html/body/div[1]/span/input/a") # div[1]指第1个元素
二.相对路径（推荐使用）

方法:找到元素有”精准元素“即唯一能标识的属性；

# 1、通过id定位(以百度首页为例)
driver.find_element_by_xpath("//*[@id='kw']").send_keys("test")
time.sleep(1)

# 2、通过class定位
driver.find_element_by_xpath("//*[@class='s_ipt']").send_keys("test")

# 3、通过name定位
driver.find_element_by_xpath("//input[@name='wd']").send_keys("test")

# 4、通过其它属性定位
driver.find_element_by_xpath("//*[@autocomplete='off']").send_keys("test")

# 5、多个属性组合定位(逻辑运算符and、or等)
driver.find_element_by_xpath("//*[@autocomplete='off' and @class='s_ipt']").send_keys("test")

# 6、通过文本属性定位
driver.find_element_by_xpath("//*[text()='新闻']")

# 7、通过父元素定位子元素（层级关系）
driver.find_element_by_xpath("//*[@id='u1']/a[2]")  # 通过上一级的id对下一级a标签进行定位（索引从1开始）

# 8、通过子元素找父元素
driver.find_element_by_xpath("//*[@id='kw']/..")  # //*[@id='kw']/../.. 这个是找爷爷

# 9、模糊匹配
driver.find_element_by_xpath("//a[contains(text(),'hao')]")     # 文本模糊匹配
driver.find_element_by_xpath("//input[contains(@class,'s_btn')]")   # class属性模糊匹配，其它类似

CSS语法定位

# 1、通过id定位
driver.find_element_by_css_selector("#kw").send_keys("test")

# 2、通过class定位(多个class属性有空格的话，将空格换成.)
driver.find_element_by_css_selector(".s_ipt").send_keys("test")

# 3、通过tag定位
driver.find_element_by_css_selector("input") # 定位所有input标签

# 4、通过其它属性定位
driver.find_element_by_css_selector("[name='wd']").send_keys("test")

# 5、通过父元素找子元素（组合定位）
driver.find_element_by_css_selector("#qrcode .qrcode-img")     # 通过id为qrcode上一级或上上级找寻下级class为qrcode-img的元素
driver.find_element_by_css_selector("qrcode .qrcode-img:nth-child(1)")     # 找刚刚上面结果的第一组元素，索引从1开始
driver.find_element_by_css_selector("#qrcode div.qrcode-img:nth-child(1)")    # 组合定位，div标签下class为qrcode-img的元素

css更多操作请看下方