1. 程式人生 > >定位頁面元素

定位頁面元素

之前 find 模塊 附加組 img term text int 分享

環境準備

安裝fitepath

火狐瀏覽器-工具-附加組件-搜索firepath進行安裝

技術分享圖片技術分享圖片技術分享圖片

安裝firebug插件

火狐瀏覽器-工具-附加組件-搜索firebug進行安裝

技術分享圖片技術分享圖片

firebug定位

打開firebug點擊查看頁面元素按鈕,再點擊想要查看的元素,就可以定位到頁面元素內容

技術分享圖片

獲取單個頁面元素

find_element_by_id

find_element_by_name

find_element_by_xpath

find_element_by_link_text

find_element_by_partial_link_text

find_element_by_tag_name

find_element_by_class_name

find_element_by_css_selector

使用id定位

技術分享圖片

#coding:utf-8
from selenium import webdriver
import time

driver=webdriver.Firefox() #啟動火狐瀏覽器
driver.get("http://www.baidu.com") #打開百度
driver.find_element_by_id(‘kw‘).send_keys("ceshi") #通過id定位搜索框然後輸入內容
driver.find_element_by_id(‘su‘).click() #通過id定位百度一下按鈕,並點擊該按鈕
time.sleep(3)
driver.quit()

使用name定位

如果name屬性是唯一的,可以通過那麽屬性定位

技術分享圖片

driver.find_element_by_name(username).send_keys("name") #通過name定位輸入框

使用class_name定位

class_name 不容易定位到元素

<input id="kw" class="s_ipt" autocomplete="off" maxlength="255" value="" name="wd"/>

driver.find_element_by_class_name(s_ipt).send_keys("ceshi

") #通過class_name定位搜索框

使用link_text定位

鏈接定位

技術分享圖片

driver.find_element_by_link_text(糯米)

使用partial_link_text定位

模糊鏈接定位

<a class="mnav" name="tj_trmap" href="http://map.baidu.com">地圖</a>

driver.find_element_by_partial_link_text(‘地‘)

使用tag_name定位

指標簽名稱定位,因為相同標簽很多,一般不用標簽定位,(可以用來定位一組元素,看定位一組元素裏面的實例),

使用xpath定位

通過屬性定位

技術分享圖片

#coding:utf-8
#第一步導入selenium裏的webdriver模塊
from selenium import webdriver
#第二步 啟動瀏覽器
driver=webdriver.Firefox() #啟動火狐瀏覽器
#第三步 打開url
driver.get("http://www.baidu.com")
driver.find_element_by_xpath("//*[@id=‘kw‘]")

通過標簽加屬性定位

技術分享圖片

driver.find_element_by_xpath("//input[@id=‘kw‘]")

driver.find_element_by_xpath("//input[@name=‘wd‘]")

driver.find_element_by_xpath("//*[@id=‘kw‘]") #*代表不用指定標簽

層級

如果一個元素屬性不是很明顯,我們可以往上找(父元素)

技術分享圖片

#通過父親定位input標簽

driver.find_element_by_xpath(‘//span[@class="bg s_btn_wr"]/input‘)

#通過爺爺定位inpu

driver.find_element_by_xpath(‘//form[@id="form"]/span[2]/input‘)

使用css定位

定位百度搜索框

技術分享圖片

通過class屬性定位

.表示class屬性

driver.find_element_by_css_selector(".s_ipt")

通過id屬性定位

#號表示id屬性,如:#kw

driver.find_element_by_css_selector("#kw")

通過其它屬性定位

driver.find_element_by_css_selector("[autocomplete=‘off‘]")

driver.find_element_by_css_selector("[name=‘wd‘]")

通過標簽定位

driver.find_element_by_css_selector("input#kw") #標簽與id屬性

driver.find_element_by_css_selector("input.s_ipt")#標簽與class屬性

driver.find_element_by_css_selector("input[id=kw]") #標簽與其它屬性

使用By定位元素

find_element()方法只用於定位元素。它需要傳入兩個參數,第一參數是定位的類型,由By提供;第二個參數是定位的具體方式。在使用By之前需要將By類導入

find_element(By.ID,kw)

find_element(By.NAME,wd)

find_element(By.NAME,wd)

find_element(By.CLASS_NAME,‘s_ipt‘)

find_element(By.TAG_NAME,‘input‘)

find_element(By.LINK_TEXT,‘新聞‘)

find_element(By.PARTIAL_LINK_TEXT,‘新‘)

find_element(By.XPATH,"//*[@id=‘kw‘]")

find_element(By.CSS_SELECTOR,"#kw")

實例

#coding=utf-8

from selenium import webdriver
from selenium.webdriver.common.by import By #導入By類
driver=webdriver.Firefox()
driver.get(‘https://www.baidu.com/‘)
driver.find_element(By.ID,‘kw‘).send_keys(u‘測試‘) #通過By id定位百度的輸入框,然後輸入內容

定位一組元素

獲取批量頁面元素

find_elements_by_name

find_elements_by_xpath

find_elements_by_link_text

find_elements_by_partial_link_text

find_elements_by_tag_name

find_elements_by_class_name

find_elements_by_css_selector

html文件內容:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body>

<form>

<input type="checkbox" name="fruit" value="berry"/>草莓</input>

<br />

<input type="checkbox" name="fruit" value="watermelon" />西瓜</input>

<br />

<input type="checkbox" name="fruit" value="orange"/>橘子</input>

</form>

</body>

</html>

技術分享圖片

腳本:

1.通過tag_name定位input元素

#coding=utf-8

import time
from selenium import webdriver
driver=webdriver.Firefox()
driver.get(r‘C:\Users\yueli\Desktop\a.html‘)
#選擇頁面上所有的tag name為input的元素
inputs=driver.find_elements_by_tag_name(‘input‘)
#然後從中過濾type為checkbox的元素,單機勾選
for i in inputs:
if i.get_attribute(‘type‘)==‘checkbox‘:
i.click()
time.sleep(3)
driver.quit()

備註:get_attribute()方法獲取元素的type的屬性值

2.通過xpath定位input元素

#coding=utf-8

import time
from selenium import webdriver
driver=webdriver.Firefox()
driver.get(r‘C:\Users\yueli\Desktop\a.html‘)
#通過xpath找到type=checkbox的元素
inputs=driver.find_elements_by_xpath("//input[@type=‘checkbox‘]")

for i in inputs:
i.click()
time.sleep(2)
print len(inputs)
#把頁面上最後1個checkbox的鉤給去掉
driver.find_elements_by_xpath("//input[@type=‘checkbox‘]").pop().click()
time.sleep(2)
driver.quit()

3.通過css定位input元素

#coding=utf-8

import time
from selenium import webdriver
driver=webdriver.Firefox()
driver.get(r‘C:\Users\yueli\Desktop\a.html‘)
#通過xpath找到type=checkbox的元素
inputs=driver.find_elements_by_css_selector("input[type=checkbox]")

for i in inputs:
i.click()
time.sleep(2)
print len(inputs)
#把頁面上最後1個checkbox的鉤給去掉
driver.find_elements_by_css_selector("input[type=checkbox]").pop().click()
time.sleep(2)
driver.quit()

Xpathcss方法 循環式不用加判斷方法,因為定位元素是已經做了判斷

pop()方法用於獲取列表中一個元素,默認為最後一個元素

定位頁面元素