selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

时间:2024-04-05 06:57:36

上一节主要介绍了selenium的id、name、class_name元素定位的方式,当元素不能通过id、name、class_name进行定位时,还可以通过xpath、css selector进行元素定位。本次主要介绍这几种方式的元素定位。

首先是xpath定位方式,通过浏览器自带的copy xpath功能,将元素的xpath信息复制下来,然后写进脚本中,以百度为例,在chrome上打开百度,在百度页面点击F12,步骤如下图:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

点击输入框之后,在高亮一行点击右键,选择copy-->copy xpath,如下图:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

copy出来的xpath为//*[@id="kw"],在selenium+Python的脚本中,通过xpath方式进行元素定位的脚本实现如下图所示:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

除了chrome浏览器可以copy xpath,firefox浏览器也可以复制,如下图,操作步骤和上面一样,本次不具体记录:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

第二,通过css selector进行元素定位,同样以百度为例,如图所示:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

copy出来的css  selector为#kw,在selenium+Python的脚本中,通过css selector方式进行元素定位的脚本实现如下图所示:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

第二,通过id、name、class_name、xpath等都不能准确的定位元素时,可以通过xpath的绝对路径、相对路径、多元素定位的方式进行定位。

xpath的绝对路径,以百度为例,在浏览器上定位百度的输入框时,html的信息为一下,通过html进行逐层定位,如下图:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

通过逐层定位之后,在脚本中的实现如以下图:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

通过绝对路径,同样也可以定位元素,但是当元素在很多级目录下时,绝对路径会比较长,难以阅读和维护,所以还可以通过相对路径进行元素定位,如下图所示,通过定位元素的上二级目录的id属性进行相对位置定位:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

定位完成后,在脚本中的实现如下图:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

第三,通过css selector进行元素定位,同样以百度为例,如图所示:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

copy出来的css  selector为#kw,在selenium+Python的脚本中,通过css selector方式进行元素定位的脚本实现如下图所示:

selenium元素定位之css selector、xpath、以及xpath的绝对路径、相对路径定位方式

以上就是selenium的元素定位方式,定位方式有很多种,在实际项目中应该根据具体情况进行选择。