Selenium元素定位方式总结(含js、jQuery定位)

来自：https://blog.csdn.net/qq_32897143/article/details/80383502

Selenium对网页的控制是基于各种前端元素的，在使用过程中，对于元素的定位是基础，只有准确抓取到对应元素才能进行后续的自动化控制，我在这里将对各种元素定位方式进行总结归纳一下。

这里将统一使用百度首页（www.baidu.com）进行示例，f12可以查看具体前端代码。

 

一、WebDriver8种基本元素定位方式

• find_element_by_id()
• find_element_by_name() 
• find_element_by_class_name() 
• find_element_by_xpath() 
• find_element_by_css_selector()
• find_element_by_tag_name ()
• find_element_by_link_text()
• find_element_by_partial_link_text()

 

二、By定位

通过对上面8种基本元素定位方式的学习，在使用过程种可以根据实际的情况去选择对应的的定位方式，我们可以用By来设置定位策略，具体语法如下：

使用下面这些的前提是需要导入By类：from selenium.webdriver.common.by import By

• find_element(By.ID,"kw")
• find_element(By.NAME,"wd")
• find_element(By.CLASS_NAME,"s_ipt")
• find_element(By.TAG_NAME,"input")
• find_element(By.LINK_TEXT,u"新闻")
• find_element(By.PARTIAL_LINK_TEXT,u"新")
• find_element(By.XPATH,"//*[@class='bg s_btn']")
• find_element(By.CSS_SELECTOR,"span.bg s_btn_wr>input#su")

 

三、最简单粗暴却失传已久的8种定位

据说这种定位方式在江湖上都快要失传了，实在想不通为什么，明明写起来最简单粗暴啊~

driver.find_element("name","wd").send_keys("Selenium")
driver.find_element("id","su").click()

相信通过上面的两只栗子，大家一定会和我一样觉得这种方式的定位实在是太省事了~只要写find_element就好啦，下面我们来总结一下这8种写法与基本定位方法类比过来该怎么写：（注意：link_text等对应为link text，中间是没有下横杠的）

• by_id -> find_element("id","")
• by_xpath -> find_element("xpath","")
• by_link_text -> find_element("link text","") 
• by_partial_text -> find_element("partial link text","")
• by_name -> find_element("name","")
• by_tag_name -> find_element("tag name","")
• by_class_name -> find_element("class name","")
• by_css_selector -> find_element("css selector","")

 

四、elements复数定位

以上的定位方式，都有对应的复数形式elements，分别是下面这些：

• id复数定位find_elements_by_id()
• name复数定位find_elements_by_name()
• class复数定位find_elements_by_class_name()
• tag复数定位find_elements_by_tag_name()
• link复数定位find_elements_by_link_text()
• partial_link复数定位find_elements_by_partial_link_text()
• xpath复数定位find_elements_by_xpath()
• css复数定位find_elements_by_css_selector()
• find_elements()

 

 

有时候就是会出现一些诡异的定位失效或者定位到了点击失效的问题，这个时候如果用js进行直接执行该事件，往往就可以解决那些诡异的事情~

五、JS的5种定位方式总结

• id定位：document.getElementById()
• name定位：document.getElementsByName()
• tag定位：document.getElementsByTagName()
• class定位：document.getElementsByClassName()
• css定位：document.querySelectorAll()

其中只有id对象用的是Element返回是单个对象，其他都是Elements返回的是一个list。这点千万要注意，具体用法和上面的webdriver基础定位一样。先写好对应的js语句，可以先赋值给一个变量，然后后调用execute_script进行执行一下js就好了，下面还是结合那个百度搜索的栗子，我写的脚本，可以对应学习实验一下：

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

# js1 = "document.getElementById('kw').setAttribute('value','selenium')"
# 或者
js1 = "document.getElementById('kw').value='selenium'" # ------getElementById------
js1 = "document.getElementsByName('wd')[0].value='selenium'" # ------getElementsByName------
# js1 = "document.getElementsByTagName('input')[0].value='selenium'" # ------getElementsTagName------
js1 = "document.getElementsByClassName('s_ipt')[0].value='selenium'" # ------getElementsClassName------
js1 = "document.querySelectorAll('#kw')[0].value='selenium'" # ------querySelectorAll------
driver.execute_script(js1)
js2 = "document.getElementById('su').click()"
driver.execute_script(js2)

以上分别结合常用的四种js定位方式写了四条js语句，然后要执行的就execute_script一下就好啦~

 

六、超神的jQuery定位

据说会jQuery定位的在定位的路上就是披襟斩棘，所向披靡~如此超神的定位，还是可以了解一下的~

jQuery语法是为HTML元素的选取编制的，可以对元素执行一些具体的操作

基础语法是$(selector).action()

$符号定义jQuery，selector选择器用来查询具体的HTML元素，通过action()来执行对元素的具体操作。

其中我们经常用到的action()在jq中有这么几种：

$(selector).val('input_value') 其中input_value表示要输入的文本的值

$(selector).val('') 如果为空，则执行后是清空的意思

$(selector).click() 行为也是肯定有的

让我们结合百度的栗子看一下，用jQuery的写法和js有一点点的类似，但明显简洁多了：

from selenium import webdriver
driver = webdriver.Chrome()
import time
driver.get("https://www.baidu.com")
# jq1 = "$('.s_ipt').val('selenium')"
# driver.execute_script(jq1)
driver.execute_script("$('.s_ipt').val('selenium')") # 输入selenium
time.sleep(1)
driver.execute_script("$('.s_ipt').val('')") # 清空
time.sleep(1)
driver.execute_script("$('.s_ipt').val('python')") # 输入python
js2 = "$('#su').click()"
driver.execute_script(js2)