Selenium定位class包含空格的元素-复合class节点

以你之姓@ 2023-10-09 06:00 12阅读 0赞

在HTML中, 节点有三种常见属性, 分别是id, name和class, 其中class是一个特殊的属性, 支持多个类名, 以空格隔开, 如下图所示:

![class包含空格的元素][class]

你是否注意到, 为什么selenium中的find\_element\_by\_class\_name, 是by\_class\_name而不是, by\_class呢?  
首先我们要区分class属性和class\_name的区别, 节点的class属性可以包含多个class\_name, 每个以空格隔开, 如上图, 该按钮实际上是一个链接, class属性值为"btn btn-primary my-2", 其中包含三个class\_name, 分别为"btn", "btn-primary", "my-2", 通过在开发者工具中按Ctrl+F搜索,我们可以发现"btn-primary"这个class\_name是唯一的. 我们可以使用它来定位.

定位方式有3种:

*  通过某个独特的class\_name定位: `dr.find_element_by_class_name('btn-primary')`
 *  使用xpath通过完整的class属性定位: dr.find\_element\_by\_xpath('//a\[@class="btn btn-primary my-2"\]')
 *  使用css selector, 通过某个属性或属性组合定位(**推荐**):  
    `dr.find_element_by_css_selector('.btn-primary')` 或 `dr.find_element_by_css_selector('.btn-primary.my-2')`

示例代码如下:

from selenium import webdriver
    
    dr = webdriver.Chrome()
    dr.get('http://qaschool.cn/')
    
    # dr.find_element_by_class_name('btn-primary').click()  # 通过某个class_name定位
    # dr.find_element_by_xpath('//a[@class="btn btn-primary my-2"]').click()  # 通过xpath结合完整的class属性定位
    
    # dr.find_element_by_css_selector('.btn-primary').click()  # 通过css selector结合某个class_name定位
    dr.find_element_by_css_selector('.btn-primary.my-2').click()  # 通过css selector结合多个class_name定位

转载于:https://www.cnblogs.com/superhin/p/11454865.html

[class]: https://upload-images.jianshu.io/upload_images/7575721-a4dd27d940033443.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240