Selenium WebDriverでJavaScriptを使用してXPathで要素を取得する方法はありますか?


252

私は次のようなものを探しています:

getElementByXpath(//html[1]/body[1]/div[1]).innerHTML

JSを使用して要素のinnerHTMLを取得する必要があります(Selenium WebDriver / Javaでそれを使用するには、WebDriverがそれ自体を見つけることができないため)。

ID属性を使用できますが、すべての要素にID属性があるわけではありません。

[修繕]

私はそれをJavaで実行するためにjsoupを使用しています。それは私のニーズにうまくいきます。


2
ちなみに、DIVはBODYの子孫(イミディエイトまたはディーパー)であり、BODYはHTMLの子である必要があるため、htmlおよびbodyセレクターは不要//DIV[1]です。 XPath式で錆びている)。同等のDOMはdocument.getElementsByTagName('div')[1](または0)です。
RobG、

回答:


421

使用できますdocument.evaluate

XPath式文字列を評価し、可能であれば指定されたタイプの結果を返します。

これはw3標準化され、文書化されています:https : //developer.mozilla.org/en-US/docs/Web/API/Document.evaluate

function getElementByXpath(path) {
  return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
}

console.log( getElementByXpath("//html[1]/body[1]/div[1]") );
<div>foo</div>

https://gist.github.com/yckart/6351935

Mozilla開発者ネットワークには、優れた紹介もあります。https//developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#document.evaluate


代替バージョン、使用XPathEvaluator


11
マジックナンバー9はどういう意味ですか?ここでは名前付き定数を使用する方が良いでしょう。
シェパード、

5
@WillSheppard XPathResult.FIRST_ORDERED_NODE_TYPE === 9 developer.mozilla.org/en-US/docs/...
yckart

2
IEをサポートするgetElementByXPath関数を作成しましたが、現時点ではいくつかの基本的なxpathサポートがあります。関数getElementXpathもそこにあり、それらは私が必要とするもののためにうまく連携します。gist.github.com/Joopmicroop/10471650
joopmicroop


var xpathResult = document.evaluate(xpathExpression、contextNode、namespaceResolver、resultType、result);
TechDog、2015年

166

Chrome Dev Toolsでは、以下を実行できます。

$x("some xpath")

1
私はこれで遊んでみましたが、機能しているようですが、この機能に関するドキュメントはありますか?何も見つかりませんでした。
エリック

これはもっと高くする必要があります。Firefoxもサポートしています。
iSWORD

これは、Webページをデバッグするときに非常に役立ちます。ありがとう。
theeranitp


21

chromeコマンドラインAPIから$ xのようなもの(複数の要素を選択するため)を試してください:

var xpath = function(xpathToExecute){
  var result = [];
  var nodesSnapshot = document.evaluate(xpathToExecute, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
  for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ ){
    result.push( nodesSnapshot.snapshotItem(i) );
  }
  return result;
}

このMDNの概要は役に立ちました:https : //developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript


9

JavaScriptのdocument.evaluateを使用して、DOMでXPath式を実行できます。IE 6に戻るブラウザーでは、何らかの方法でサポートされていると思います。

MDN:https : //developer.mozilla.org/en-US/docs/Web/API/Document/evaluate

IEは代わりにselectNodesをサポートしています。

MSDN:https : //msdn.microsoft.com/en-us/library/ms754523(v=vs.85).aspx


7
{document.evaluate}はIEでは機能しないことに注意してください。
クリストファーベールズ2013年

2

スクリーンマップのxpathクエリを開発してテストすることが目的であると想定します。次に、Chromeのデベロッパーツールを使用します。これにより、xpathクエリを実行して一致を表示できます。または、Firefox> 9では、Web Developer Toolsコンソールで同じことを行うことができます。以前のバージョンでは、x-path-finderまたはFirebugを使用してください


2
public class JSElementLocator {

    @Test
    public void locateElement() throws InterruptedException{
        WebDriver driver = WebDriverProducerFactory.getWebDriver("firefox");

        driver.get("https://www.google.co.in/");


        WebElement searchbox = null;

        Thread.sleep(1000);
        searchbox = (WebElement) (((JavascriptExecutor) driver).executeScript("return document.getElementById('lst-ib');", searchbox));
        searchbox.sendKeys("hello");
    }
}

適切なロケーターを使用していることを確認してください。


1
こんにちはPrerit、問題はそのxpathに基づく要素によって選択することでした。あなたが提供したソリューションは、IDで選択することです。:)
Gaurav Thantry

2
**Different way to Find Element:**

IEDriver.findElement(By.id("id"));
IEDriver.findElement(By.linkText("linkText"));
IEDriver.findElement(By.xpath("xpath"));

IEDriver.findElement(By.xpath(".//*[@id='id']"));
IEDriver.findElement(By.xpath("//button[contains(.,'button name')]"));
IEDriver.findElement(By.xpath("//a[contains(.,'text name')]"));
IEDriver.findElement(By.xpath("//label[contains(.,'label name')]"));

IEDriver.findElement(By.xpath("//*[contains(text(), 'your text')]");

Check Case Sensitive:
IEDriver.findElement(By.xpath("//*[contains(lower-case(text()),'your text')]");

For exact match: 
IEDriver.findElement(By.xpath("//button[text()='your text']");

**Find NG-Element:**

Xpath == //td[contains(@ng-show,'childsegment.AddLocation')]
CssSelector == .sprite.icon-cancel

0
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

System.setProperty("webdriver.chrome.driver", "path of your chrome exe");
        WebDriver driver = new ChromeDriver();
        driver.manage().window().maximize();
        driver.get("https://www.google.com");

            driver.findElement(By.xpath(".//*[@id='UserName']")).clear();
            driver.findElement(By.xpath(".//*[@id='UserName']")).sendKeys(Email);

説明的な答えを追加します。説明は、質問者がソリューションをすばやく理解するのに役立ちます。
NickCoder

0

要点を述べると、xapthを簡単に使用できます。以下のコードを使用して、これを正確かつ簡単に行うことができます。親切にフィードバックを提供してみてください。ありがとうございます。

JavascriptExecutor js = (JavascriptExecutor) driver;

    //To click an element 
    WebElement element=driver.findElement(By.xpath(Xpath));
    js.executeScript(("arguments[0].click();", element);

    //To gettext

    String theTextIWant = (String) js.executeScript("return arguments[0].value;",driver.findElement(By.xpath("//input[@id='display-name']")));

さらに読む-https ://medium.com/@smeesheady/webdriver-javascriptexecutor-interact-with-elements-and-open-and-handle-multiple-tabs-and-get-url-dcfda49bfa0f


OPがあなたのようなSeleniumソリューションを要求しなかったと思いますよね?
ankostis
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.