Selenium系列教程-05 findElements 方法詳解

趙陽陽發表於2018-05-30

系列資源：

主要內容

  • findElements方法簡介
  • findElement與findElements對比
  • findElements的使用場景

findElements 方法簡介

在之前的元素定位章節中我們定位頁面元素的方式都是使用 driver.findElement() 這樣的方式來定位元素。常用操作如下：

driver.findElement({id:xxxxxxxx}) 
複製程式碼

在selenium-webdriver 中，findElement方法返回的為單個元素，findElements方法返回具有某一特徵的所有元素集合。以百度首頁為例：

我們可以看到導航欄，6個不同的超連結它們的class 屬性相同，如果我們要一次獲取這6個元素的話，我們就可以使用findElements方法來獲取。node.js程式碼如下:

require('chromedriver')

const { Builder } = require('selenium-webdriver')

let driver = new Builder().forBrowser('chrome').build()

driver.get('http://www.baidu.com')
//使用findElements 方法
driver.findElements({className:'mnav'}).then((eles)=>{
    for(let ele of eles){
        ele.getText().then((text)=>{
            console.log("text:",text)
        })
    }})
複製程式碼

執行結果：

text: 新聞
text: hao123
text: 地圖
text: 視訊
text: 貼吧
text: 學術
複製程式碼

findElement與findElements方法的對比

我們通過以上的例子可以知道呼叫findElement返回單個元素，findElements返回為符合某一特徵的多個元素的集合。我們可以通過使用 id ,className ,css ,xpath ,name ,linkText ,linkText partialLinkText tagName 這8種方法來定位元素。我們知道，web頁面中元素有id屬性的時候，代表這個元素在整個頁面中就是唯一的。所以，在使使用findElements方法查詢多個元素的時候，我們通常不會使用id屬性來獲取多個元素。所以，在使用findElements 方法的時候，通常不會用到元素的id屬性，而其它7中定位方式都可以通用。以下簡單的表格比較:

方法名 findElement findElenents
解釋 查詢Web頁面中符合特徵的某個元素 返回Web頁面中符合某類特徵的多個元素
支援的元素定位方式 id ,className ,css ,xpath ,name , linkText ,linkText , partialLinkText , tagName className,css ,xpath ,name ,linkText ,linkText ,partialLinkText ,tagName

findElements 一般使用場景

我們知道，在web自動化測試過程，我們使用到最多的方法為findElement去操作單個元素。那麼findElements的使用場景有哪些呢？

  • 導航欄頁面元素

在web設計上，前端工程師一般會使用相同的樣式檔案來定義導航欄中的元素，當我們需要對導航欄上的文字是否顯示正確的時候，我們就可以使用findElements方法定位所有元素，如上面例子中對百度的操作。

  • 頁面中具有某一特徵的所有元素

在某些列表中，我們統計列表中的元素有多少個，或者獲取每個列表元素。例如，電商網站中常見的商品列表。 以上是一些常用到的場景，當然，根據我們系統的業務不同，針對不同場景，大家可以自行再總結。

獲取更多資訊，可以關注公眾號,也可以加QQ群：707467292 進行node.js自動化相關技術交流。

Selenium系列教程-05 findElements 方法詳解

相關文章