Selenium WebDriver에서 JavaScript를 사용하여 XPath로 요소를 얻는 방법이 있습니까?


252

나는 다음과 같은 것을 찾고있다 :

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

JS를 사용하여 요소의 innerHTML을 가져와야합니다 (WebDriver가 자체를 찾을 수 없으므로 Selenium WebDriver / Java에서 사용하려면).

ID 속성을 사용할 수 있지만 모든 요소에 ID 속성이있는 것은 아닙니다.

[결정된]

Java에서 완료하기 위해 jsoup을 사용하고 있습니다. 그것은 나의 필요를 위해 작동합니다.


2
또한, htmlbodyDIV에이 BODY의 하위 수 (즉시 또는 깊이)와 BODY는 HTML의 자식이어야해야하기 때문에 선택기가 불필요한, 그래서 문서에서 다른 DIV 요소가없는 제공 //DIV[1]내가 꽤 있어요 불구하고 작동해야이 ( XPath 표현식에 녹슨). DOM에 상응하는 것은 document.getElementsByTagName('div')[1](또는 아마도 0)입니다.
RobG

답변:


422

당신은 사용할 수 있습니다 document.evaluate:

XPath 표현식 문자열을 평가하고 가능한 경우 지정된 유형의 결과를 리턴합니다.

그것은 표준화 되고 전체적으로 문서화되어 있습니다 : 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는 지원하지만 현재는 기본 xpath를 지원하는 getElementByXPath 함수를 작성했습니다. 거기에는 getElementXpath 함수가 있으며 필요한 것에 대해 잘 작동합니다. gist.github.com/Joopmicroop/10471650
joopmicroop


var xpathResult = document.evaluate (xpathExpression, contextNode, namespaceResolver, resultType, result);
TechDog

167

Chrome 개발자 도구에서 다음을 실행할 수 있습니다.

$x("some xpath")

1
나는 이것을 가지고 놀았지만 효과가있는 것 같지만이 기능에 대한 문서가 있습니까? 나는 아무것도 찾지 못했습니다.
Eric

이보다 높아야합니다. Firefox도 지원합니다.
iSWORD

웹 페이지를 디버깅 할 때 매우 유용합니다. 감사.
theeranitp


21

크롬 커맨드 라인 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는 대신 selectNode 를 지원 합니다.

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


7
IE에서 {document.evaluate}이 (가) 작동하지 않습니다.
Christopher Bales


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.