jquery 給類名元素添加行内樣式_Selenium元素定位不到？JS注入輕松搞定！

在使用Selenium做web自動化測試過程中，經常會遇到一些元件無法通過Selenium直接識别和處理，比如标簽組合的下拉框，比如日期控件。面對這些元素，我們可以引入JS注入技術來解決問題。

JavaScript是一種被廣泛用于Web前端開發的腳本語言 ,常用來為網頁添加動态功能(彈窗，點選事件....)通過HTML DOM，JavaScript提供了頁面對象擷取和操作功能。

DOM模型把HTML文檔解析成一棵樹，根節點是，從根節點往下根據節點之間的關系(順序或包含)把節點解析為兄弟節點和孩子節點。 節點有不同的類型：

元素

屬性

文本

Javascript可以根據DOM結構擷取任意的HTML元素，變更這些元素的屬性，樣式，并對元素的滑鼠鍵盤事件做出響應：

Javascript提供了通過id查找元素的方式：document.getElementById(id)；除了id, javascript還支援通過類名和标簽名查找元素

Javascript提供通過innerHTML改變元素内容的方式：document.getElementById(id).innerHTML=new HTML，通過變更節點内部的HTML可以改變元素的文本和行為

Javascript提供通過attribute改變元素屬性的方式：

document.getElementById(id).attribute=new value

Selenium支援Javascript

Selenium WebDriver可以被轉換為JavaScriptExecutor，通過JavaScriptExecutor執行Javascript腳本，通過這種方式可以實作Selenium的Javascript注入，進而實作對複雜頁面元素的操作。

WebDriver driver=newChromeDriver();

JavascriptExecutor js = (JavascriptExecutor) driver;

js.executeScript("js語句");

Jquery

Jquery是一個增強的JavaScript架構，它封裝了JavaScript常用的功能代碼，簡化了HTML文檔操作、事件處理、動畫設計和Ajax互動。

對于複雜的網頁元素查找，通過Javascript較為低效，此時可以引入Jquery簡化元素查找。

Jquery常見選擇器如下，詳細文法課參見官網https://jquery.com/

Selenium支援Jquery

Selenium可以通過判定目前待測的網站是否引入Jquery，如果沒有則加載Jquery，加載完畢以後即可用Jquery代碼來實作前端頁面元素的操作。

publicclass JqueryTest {

staticJavascriptExecutor js;

staticWebDriver driver;

publicstaticvoidmain(String[] args) {

driver=newChromeDriver();

js=(JavascriptExecutor)driver;

driver.get("http://www.baidu.com/");

//判斷Jquery是否存在,若不存在則注入

if(!jqueryLoaded()){

injectJquery();

}

//通過jquery查找出頁面百度連結元素個數(.mnav)

List elements = (List) js

.executeScript("return jQuery.find('.mnav')");

driver.quit();

}

publicstaticbooleanjqueryLoaded() {

booleanloaded=false;

try{

loaded = (Boolean) js.executeScript("return"+" jQuery()!=null");

}catch(Exception e){

System.out.println("查找jQuery對象出現異常");

}

System.out.println("頁面已存在Jquery對象，無需注入："+ loaded);

returnloaded;

}

publicstaticvoidinjectJquery() {

js.executeScript(" var headID = "

+"document.getElementsByTagName("head")[0];"

+"var newScript = document.createElement('script');"

+"newScript.type = 'text/javascript';"

+"newScript.src = "

+"'http://code.jquery.com/jquery-latest.js';"

+"headID.appendChild(newScript);");

作　　者： Testfan kitty

出　　處：微信公衆号：自動化軟體測試平台

版權說明：歡迎轉載，但必須注明出處，并在文章頁面明顯位置給出文章連結