2. 程式人生 > >python3 xpath獲取同級元素的各種方法

python3 xpath獲取同級元素的各種方法

阿新 • • 發佈：2019-02-04

XPath軸(XPath Axes)可定義某個相對於當前節點的節點集： 
1、child 選取當前節點的所有子元素 
2、parent 選取當前節點的父節點 
3、descendant 選取當前節點的所有後代元素（子、孫等） 
4、ancestor 選取當前節點的所有先輩（父、祖父等） 
5、descendant-or-self 選取當前節點的所有後代元素（子、孫等）以及當前節點本身 
6、ancestor-or-self 選取當前節點的所有先輩（父、祖父等）以及當前節點本身 
7、preceding-sibling 選取當前節點之前的所有同級節點 
8、following-sibling 選取當前節點之後的所有同級節點 
9、preceding 選取文件中當前節點的開始標籤之前的所有節點 
10、following 選取文件中當前節點的結束標籤之後的所有節點 
11、self 選取當前節點 
12、attribute 選取當前節點的所有屬性 
13、namespace 選取當前節點的所有名稱空間節點 
如：要定位當前td同級後的一個td

//td[.='text']/following-sibling::td

     following-sibling 選取當前節點之後的所有同級節點,跟preceding-sibling一樣都是選取同級同父的節點，只不過following是取對應節點之後的節點，preceding-sibling取的是該節點之前的節點。

     /AAA/BBB/following-sibling::*    取/AAA/BBB節點的之後的所有同級節點

  <AAA> 
     <BBB> 
          <CCC/> 
          <DDD/> 
     </BBB> 
     <XXX> 
          <DDD> 
               <EEE/> 
               <DDD/> 
               <CCC/> 
               <FFF/> 
               <FFF> 
                    <GGG/> 
               </FFF> 
          </DDD> 
     </XXX> 
     <CCC> 
          <DDD/> 
     </CCC> 
   </AAA>

     //CCC/following-sibling::*    選取所有CCC元素的之後所有同級節點



   <AAA> 
     <BBB> 
          <CCC/> 
          <DDD/> 
     </BBB> 
     <XXX> 
          <DDD> 
               <EEE/> 
               <DDD/> 
               <CCC/> 
               <FFF/> 
               <FFF> 
                    <GGG/> 
               </FFF> 
          </DDD> 
     </XXX> 
     <CCC> 
          <DDD/> 
     </CCC> 
   </AAA>

今天跟大家分享下selenium中根據父子、兄弟、相鄰節點定位的方法，很多人在實際應用中會遇到想定位的節點無法直接定位，需要通過附近節點來相對定位的問題，但從父節點定位子節點容易，從子節點定位父節點、定位一個節點的哥哥節點就一籌莫展了，別急，且看博主一步步講解。

1. 由父節點定位子節點

最簡單的肯定就是由父節點定位子節點了，我們有很多方法可以定位，下面上個例子：

對以下程式碼：

<html>
<body>
<div id="A">
    <!--父節點定位子節點-->
    <div id="B">
        <div>parent to child</div>
    </div>
</div>
</body>
</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

想要根據 B節點 定位無id的子節點，程式碼示例如下：

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

driver = webdriver.Firefox()
driver.get('D:\\py\\AutoTestFramework\\src\\others\\test.html')

# 1.串聯尋找
print driver.find_element_by_id('B').find_element_by_tag_name('div').text

# 2.xpath父子關係尋找
print driver.find_element_by_xpath("//div[@id='B']/div").text

# 3.css selector父子關係尋找
print driver.find_element_by_css_selector('div#B>div').text

# 4.css selector nth-child
print driver.find_element_by_css_selector('div#B div:nth-child(1)').text

# 5.css selector nth-of-type
print driver.find_element_by_css_selector('div#B div:nth-of-type(1)').text

# 6.xpath軸 child
print driver.find_element_by_xpath("//div[@id='B']/child::div").text

driver.quit()
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25

結果：

parent to child
parent to child
parent to child
parent to child
parent to child
parent to child
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

第1到第3都是我們熟悉的方法，便不再多言。第4種方法用到了css選擇器：nth-child(n)，該選擇器返回第n個節點，該節點為div標籤；第5種方法用到了另一個css選擇器： nth-of-type(n)，該選擇器返回第n個div標籤，注意與上一個選擇器的區別；第6種方法用到了xpath軸 child，這個是xpath預設的軸，可以忽略不寫，其實質是跟方法2一樣的。

當然，css中還有一些選擇器是可以選擇父子關係的如last-child、nth-last-child等，感興趣可以自行百度，有機會博主會講講css selector。

2. 由子節點定位父節點

由子節點想要定位到父節點就有點難度了，對以下程式碼：

<html>
<body>
<div id="A">
    <!--子節點定位父節點-->
    <div>
        <div>child to parent
            <div>
                <div id="C"></div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14

我們想要由 C節點 定位其兩層父節點的div，示例程式碼如下：

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

driver = webdriver.Firefox()
driver.get('D:\\py\\AutoTestFramework\\src\\others\\test.html')

# 1.xpath: `.`代表當前節點; '..'代表父節點
print driver.find_element_by_xpath("//div[@id='C']/../..").text

# 2.xpath軸 parent
print driver.find_element_by_xpath("//div[@id='C']/parent::*/parent::div").text

driver.quit()
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

結果：

child to parent
child to parent
  • 1
  • 2

這裡我們有兩種辦法，第1種是 .. 的形式，就像我們知道的，. 表示當前節點，.. 表示父節點；第2種辦法跟上面一樣，是xpath軸中的一個：parent，取當前節點的父節點。這裡也是css selector的一個痛點，因為css的設計不允許有能夠獲取父節點的辦法（至少目前沒有）

3. 由弟弟節點定位哥哥節點

這是第3、第4種情況，我們這裡要定位的是兄弟節點了。如以下原始碼：

<html>
<body>
<div>
    <!--下面兩個節點用於兄弟節點定位-->
    <div>brother 1</div>
    <div id="D"></div>
    <div>brother 2</div>
</div>
</body>
</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

怎麼通過 D節點 定位其哥哥節點呢？看程式碼示例：

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

driver = webdriver.Firefox()
driver.get('D:\\Code\\py\\AutoTestFramework\\src\\others\\test.html')

# 1.xpath,通過父節點獲取其哥哥節點
print driver.find_element_by_xpath("//div[@id='D']/../div[1]").text

# 2.xpath軸 preceding-sibling
print driver.find_element_by_xpath("//div[@id='D']/preceding-sibling::div[1]").text

driver.quit()
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

結果

brother 1
brother 1
  • 1
  • 2

這裡博主也列舉了兩種方法，一種是通過該節點的父節點來獲得哥哥節點，另外一種比較優雅，是通過 xpath軸：preceding-sibling，其能夠獲取當前節點的所有同級哥哥節點，注意括號裡的標號，1 代表著離當前節點最近的一個哥哥節點，數字越大表示離當前節點越遠，當然，xpath軸：preceding也可以，但是使用起來比較複雜，它獲取到的是該節點之前的所有非祖先節點（這裡不太好解釋，改天專門寫篇博文講解下所有的軸）

4. 由哥哥節點定位弟弟節點

原始碼與 3 一致，要想通過 D節點 定位其弟弟節點，看程式碼示例：

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

driver = webdriver.Firefox()
driver.get('D:\\Code\\py\\AutoTestFramework\\src\\others\\test.html')

# 1.xpath，通過父節點獲取其弟弟節點
print driver.find_element_by_xpath("//div[@id='D']/../div[3]").text

# 2.xpath軸 following-sibling
print driver.find_element_by_xpath("//div[@id='D']/following-sibling::div[1]").text

# 3.xpath軸 following
print driver.find_element_by_xpath("//div[@id='D']/following::*").text

# 4.css selector +
print driver.find_element_by_css_selector('div#D + div').text

# 5.css selector ~
print driver.find_element_by_css_selector('div#D ~ div').text

driver.quit()
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22

結果：

brother 2
brother 2
brother 2
brother 2
brother 2
  • 1
  • 2
  • 3
  • 4
  • 5

博主分享了五種方法定位其弟弟節點，上面三種是用xpath，第一種很好理解，第二種用到了xpath軸：following-sibling，跟preceding-sibling類似，它的作用是獲取當前節點的所有同級弟弟節點，同樣，1 代表離當前節點最近的一個弟弟節點，數字越大表示離當前節點越遠；第三種用到了xpath軸：following，獲取到該節點之後所有節點，除了祖先節點（跟preceding方向相反，但因為往下順序容易讀，不容易出錯，所以也是可以用來獲取弟弟節點的，但也不建議這麼使用）；第四、第五種，我們用到了css selector，+ 和 ~ 的區別是： +表示緊跟在當前節點之後的div節點，~ 表示當前節點之後的div節點，如果用find_elements，則可獲取到一組div節點。

 轉原貼地址：https://www.cnblogs.com/VseYoung/p/8686383.html

相關推薦

python3 xpath獲取同級元素的各種方法

XPath軸(XPath Axes)可定義某個相對於當前節點的節點集： 1、child 選取當前節點的所有子元素 2、parent 選取當前節點的父節點 3、descendant 選取當前節點的所有後代元素（子、孫等） 4、ancestor 選取當前節點的所有先輩（父、祖父等

【轉載】java 獲取路徑的各種方法

strong filepath 文件路徑 etc dex 讀取 workspace for class 轉載只供個人學習參考，查看請前往原出處：http://www.cnblogs.com/guoyuqiangf8/p/3506768.html 主要方法有： (1)、req

xpath獲取同級節點

desc ces mes exp 標簽 文檔 ring rec span XPath軸(XPath Axes)可定義某個相對於當前節點的節點集： 1、child 選取當前節點的所有子元素 2、parent 選取當前節點的父節點 3、descendant 選取當前節點的所有後

vue1和vue2獲取dom元素的方法

log col 方法 art nbsp tps ref class refs vue1.*版本中 在標簽中加上el=‘dom‘，然後在代碼中this.$els.dom這樣就拿到了頁面元素 例如：<div class=‘box‘ v-el: myBox>你好<

前端——通過父元素獲取同級元素的name屬性

今天在寫專案的時候需要將一個<img>的name值傳送給controller，相應的htmll程式碼如下： <div class="seller_good"> <a href="#"><img class="shoe_img" id="shoe_img

java ----獲取路徑的各種方法(總結)

Java Web開發中路徑問題小結 （1） Web開發中路徑的幾個基本概念 假設在瀏覽器中訪問了如下的頁面，如圖1所示： 　　 那麼針對這個站點的幾個基本概念表述如下： 二．幾個路徑相關函式的返回值： 在TestURL.jsp檔案中測試了三個路徑相關函式：

java 獲取路徑的各種方法

(1)、request.getRealPath("/");//不推薦使用獲取工程的根路徑(2)、request.getRealPath(request.getRequestURI());//獲取jsp的路徑，這個方法比較好用，可以直接在servlet和jsp中使用(3)、re

Java中獲取路徑的各種方法

1、 java檔案中獲得路徑 Thread.currentThread().getContextClassLoader().getResource("") //獲得資原始檔(.class檔案)所在路徑 ClassLoader.getSystemResource("")

jQuery獲取所有父級元素及同級元素及子元素的方法

-m logs 當前 tor mar eval div 進行 nds jQuery獲取所有父級元素及同級元素及子元素的方法 1.獲取父級元素 $("#id").parent() 獲取其父級元素 $("#id").parents(

jQuery獲取兄弟元素的各種方法總結

1.next();//獲取當前元素的下一個兄弟元素 2.nextAll();//獲取當前元素後面所有的兄弟元素 3.prev();//獲取當前元素的前一個兄弟元素 4.prevAll();//獲取當前元素前面的所有兄弟元素 5.siblings();//獲取當前元素的所有兄弟元素 6.chi

C# 獲取文件下載的各種方法

std finally 設置 出錯 word div 獲取文件 mar soft public class RemoteDownload { public static void DownLoad(string addressUrl,string

JS/JQuery獲取當前元素的上一個/下一個兄弟級元素等元素的方法

input logs type ron put 綁定 style wid cti $(function(){ //遍歷獲取的input元素對象數組，綁定click事件 var len = $("input[type=‘file‘]").length;

動態獲取html頁面的內容，而且取當中的某塊元素的方法

var mod .ajax pos spa app sync lte index ??$.ajax({ url: "http://192.168.1.59:8888/app-tpl-webapp/tpl/design.html", async:f

Javascript獲取html元素的幾種方法

nbsp code tel html元素 參數 ctype regex head html 1.通過id獲取html元素 <!DOCTYPE html> <html> <head lang="en"> <me

使用jquery獲取父元素或父節點的方法

返回 number 子元素 文本 事件 什麽 nbsp 可選 元素 jquery獲取父元素方法比較多，比如parent()，parents()，closest()這些都能幫你實現查找父元素或節點，下面我們來一一講解： 先舉個例子， 1.<ul class="paren

jquery獲取父級元素、子級元素、兄弟元素的方法

next 返回結果 初始 對象 clas 祖先 eval p s all jQuery.parent(expr) 找父親節點，可以傳入expr進行過濾，比如$("span").parent()或者$("span").parent(".class") jQuery.par

jquery選擇器 之 獲取父級元素、同級元素、子元素 (轉載)

content 異同 sele sel node pan query -a ofo 一、獲取父級元素 1、 parent([expr]): 獲取指定元素的所有父級元素 <div id="par_div"><a id="href_fir" href="#

JQuery獲取元素的方法總結

clas 內容 存在 過濾器 put ID .class 元素選擇器 IV jQuery定位元素的方法有兩種，一種是通過jQuery 選擇器來選擇元素，可以直接獲取單個或批量的元素；另一種是通過jQuery 遍歷相關來選擇元素，這種方法常用在獲取層級較復雜的頁面中的元素。

jquery獲取父元素或父節點的方法

包含 檢查 所有 有用 code 直接 過濾 ffffff 多個 jquery獲取父元素方法比較多，比如parent()，parents()，closest()這些都能幫你實現查找父元素或節點，下面我們來一一講解： 先舉個例子: <ul class="parent1

jquery獲取元素各種寬高及頁面寬高總結

轉載：https://www.cnblogs.com/goloving/p/7113567.html     $(function(){      var a = $("#div").width(),//width()返回元素的寬高，不包