打开此篇文章，你将收获到如下知识：

目录

1、 Selenium中选择元素的基本方法

      1.1 选择元素的方法1：根据ID属性选择元素

      1.2 选择元素的方法2：根据class属性选择元素

      1.3 选择元素的方法3：根据tag名选择元素

      1.4 选择元素的方法4：根据WebElement对象选择元素

本章总结：

1、Selenium中选择元素的基本方法

web界面自动化，就是要实现自动化地操控界面元素，要想实现自动操控界面元素，就得先必须要让浏览器先找到元素，然后才能操作元素。

那么怎么让浏览器找到元素呢，首先就需要选择（定位）界面元素 ，也就是要先告诉浏览器，你要操作哪个界面元素， 让它找到你想要操作的界面元素。

怎么让浏览器找到元素呢？方法就是：告诉浏览器你要操作的这个web 元素的特征 ，以及这个元素与其它元素有什么与众不同的地方，可以让浏览器一下子准确无误地找到它。

那么web元素的特征怎么看，一般有两种方法：

（1）使用浏览器的【开发者工具】打开调试窗口，可以查看、选择 web 元素：

步骤：点击浏览器右上角的三个点的扩展按钮>>在打开的页面点击【更多工具】>>点击【开发者工具】，便可以打开浏览器控制台调试窗口>>点击该调试窗口点击左上角的【Elements】标签，即可查看界面HTML 元素情况。

（2）用chrome浏览器的话，直接按键盘上的【F12】键，点击浏览器控制台调试窗口处的【Elements】标签，即可查看界面HTML 元素情况

通过如上两种方式打开浏览器控制台调试窗口后，再点击最左边的箭头图标，如下所示：

这样你用鼠标在界面上点击哪个元素，就可以查看该元素对应的html标签 了。

前面我们介绍了如何手动地去查看界面元素，那么，Web自动化过程中，具体是怎么找到我们要操作的目标元素的呢？接下来就开始介绍几种常见的选择元素的方法。

1.1   选择元素的方法1：根据ID属性选择元素

案例1：如果我们要实现自动化地在百度首页输入框输入字符Selenium，并点击百度一下按钮进行查询的操作，用代码怎么自动化地实现呢？

思路：首先找到百度首页输入框的元素>>然后在输入框输入字符Selenium>>其次找到【百度一下】按钮的元素>>最后点击【百度一下】按钮操作

手动定位元素：

（1）首先，鼠标点击浏览器控制台调试窗口最左边的箭头图标，再点击百度首页的输入框，这时控制台【Elements】标签页有一行html代码高亮显示（如下图序号3）：

为了看的明显将这行代码复制出来，如下：

由上面代码可以看出，该元素有一个id属性为kw。

（2）用步骤1类似的方法点击【百度一下】按钮，查看该按钮的元素

同样，我们将代码复制出来：

由上面代码可以看出，该元素有一个id属性为su。

上面我们手动实现了元素定位，接下来我们来尝试在代码实现时用上述的id属性值来定位元素，看是否可以实现成功。下面我们来看代码的实现过程：

示例代码1：

运行结果：

自动化地在百度首页输入框输入了Selenium，并成功实现了自动查询操作。

1.2   选择元素的方法2：根据class属性选择元素

案例2：如果我们要实现自动化地列出hao123首页右上角查询区域的功能列表，用代码怎么自动化地实现呢？

由上面代码可以看出，该元素有一个 class属性为head-item-links-area

上面我们手动实现了元素定位，接下来我们来尝试在代码实现时用上述的class属性值来定位元素，看是否可以实现成功。下面我们来看代码的实现过程：

示例代码2：

运行结果：

查IP

邮箱

地图

汇率

火车票

查快递

疫情防控

股票行情

违章查询

个税查询

网盘

翻译

代码解析：由上面的代码可以看出，

（1）根据class name选择元素时调用WebDriver对象的find_elements方法，传入(By.CLASS_NAME、class属性值)

elements = wdtd.find_elements(By.CLASS_NAME,head-item-links-area)

（2）根据class name选择元素，返回的是一个列表。

（3）通过 for循环来遍历列表元素的值。

for element in elements:   print(element.text)

1.3   选择元素的方法3：根据tag名选择元素

案例3：如果我们要实现查找hao123首页tag名为div的元素，用代码怎么自动化地实现呢？

示例代码3：

运行结果：

设为首页

武汉切换

七日天气

今晴

22～30℃ 优

优

明晴

23～33℃

6月13日

星期二

四月廿六

星座运势

查IP

邮箱

地图

汇率

火车票

查快递

疫情防控

股票行情

违章查询

个税查询

网盘

翻译

登录

展开

网页

4

高考结束妹妹才得知姐姐去世一个月

格力主播穿免职裙 网友提醒被拉黑

局长妻子长期吃空饷？单位回应

被绞死男子家属：工人疑见尸块未报告

高考结束妹妹才得知姐姐去世一个月格力主播穿免职裙 网友提醒被拉黑毕业歌送给1158万毕业生

男生挤痘流血近1小时：用了400张纸美军前情报官员：外星人曾杀害人类杨子首谈黄圣依被封杀

hao123推荐人民网新华网央视网国际在线中国日报中国网中经网光明网央广网求是网中青网网信网武汉市政府

百度•高考加油新浪•微博搜狐•热点腾讯网易百度地图游戏•页游大全hao123头条hao123影视爱淘宝

超级爆卖

京东阿里1688天猫国际携程旅行网好看视频天猫618哔哩哔哩爱奇艺•电视剧聚划算今日特价

大牌直降

东方财富知乎网易云音乐12306凤凰网学信网豆瓣网

58同城阳光高考37游戏京东数码安居客房产9377游戏百度学术智慧职教百度文库•办公人事考试网文心一格工商银行

虎扑体育51游戏爱企查喜马拉雅FMQQ邮箱

信用中国

点击展开

电影

电视

小说

游戏

1

变形金刚

热搜指数 : 541669

地区 : 其它

类型 : 动作

2速度与激情10196893

3检察风云154354

4人生路不熟89111

5龙马精神88239

6满江红80760

7流浪地球280017

8灌篮高手64776

9银河护卫队353583

10疾速追杀449211

......

......

......

代码分析：

通过上面代码可以看出，查找tag名为div的元素，查找结果很多很多，要霸屏的节奏。通过手工查找页面元素，也可以发现html页面元素中tag名为div的元素很多。

1.4   选择元素的方法4：根据WebElement对象选择元素

案例4：通过如上案例3我们发现hao123首页tag名为div的元素很多很多，多的不计其数，那么，我们有没有什么办法缩小查找范围，只查询某一个范围下的tag名为div的元素，用代码怎么自动化地实现呢？

示例代码4：

运行结果：

hao123推荐 人民网 新华网 央视网 国际在线 中国日报 中国网 中经网 光明网 央广网 求是网 中青网 网信网 武汉市政府

代码解析：

通过上面代码可以看出，查找tag名为div的元素时，限制选择元素的范围是id为hao123-govsite元素的内部,TAG_NAME为div的元素，查询结果就比案例3中的结果减少了很多。它的实现思路是：

（1）先根据ID选择元素：

# 根据id选择元素，返回的就是该元素对应的WebElement对象

（2）限制选择元素的范围是id为hao123-govsite元素的内部,TAG_NAME为div的元素

# 限制选择元素的范围是id为hao123-govsite元素的内部,TAG_NAME为div的元素对应的WebElement对象

divs = element.find_elements(By.TAG_NAME,div)

for div in divs:

本章总结：

web界面自动化，就是要实现自动化地操控界面元素，要想实现自动操控界面元素，就得先必须要让浏览器先找到元素，然后才能操作元素。

web界面自动化测试中，选择元素可以通过根据ID属性、class属性、tag名、WebElement对象等方式找到元素。