Selenium DOM 定位器的语义是如何工作的？答案

【问题标题】：How does semantics of Selenium DOM locators work?Selenium DOM 定位器的语义是如何工作的？
【发布时间】：2019-08-22 18:59:32
【问题描述】：

我正在尝试理解 Selenium DOM 定位器的语义。文档指出，它们基本上是评估以获取目标元素的 Javascript 表达式。但如果我尝试评估例如document.div[0].button[2]（来自these examples），我只会得到Error: TypeError: document.div is undefined。

这个例子无效吗？这是一种过时的 DOM 导航方式，它在现代浏览器中不再支持，但被 Selenium 模拟以实现向后兼容性？有没有关于这种语法如何工作的文档？

请注意，我并不是在尝试使用 DOM 定位器 - 我很清楚使用 CSS 或 id 甚至 XPath 会更干净。但是，我需要了解它们的语义，这样我才能编写代码，将常见的 DOM 定位器转换为 XPath 定位器，以便在 WebDriver 中使用。

【问题讨论】：

这里对 Selenium 中的一些 DOM 命令进行了很好的概述：simple-talk.com/dotnet/.net-framework/… ... .它提供了一个 PDF 文件，基本上是 eugene 在下面谈到的内容。
@Arran：这实际上正是我想要的。使用该表，我可以编写我需要的转换器。您能否将您的评论作为答案发表，以便我将其标记为已接受的答案？

标签： javascript dom selenium

【解决方案1】：

我将分享我对 DOM 定位器的理解。有几种 DOM 缩写：

gEBI - getElementById
gEBTN - getElementsByTagName

Xpath 定位器和 css 选择器用于 selenium web 驱动程序的上下文中，DOM 定位器用于 javascript 的上下文中（即要正确使用 DOM 定位器定位元素，您应该首先用 JavascriptExecutor 包装 DOM 定位器）

用法示例：

Whole web page         document.documentElement
Whole web page body    document.body
Element <E> by absolute reference     document.body.childNodes[i]...childNodes[j]
Element <E> by relative reference     document.gEBTN('E')[0]   

document.getElementById('TestTable')
First <E> child     document.getEBTN('E')[0]
Last <E> child      document.gEBTN(E)[document.gEBTN(E).length-1]   

Second <E> child              document.getEBTN('E')[1]
Second-to-last <E> child      document.gEBTN(E)[document.gEBTN(E).length-2]
Parent of element <E>         document.gEBTN('E')[0].parentNode   

Descendant <E> of element with id I using specific path   
document.gEBI('I')…gEBTN('E')[0]      

Descendant <E> of element with id I using unspecified path
document.gEBI('I').gEBTN('E')[0]

因此，如果您想完成这项工作，我们应该调用 jsExecutor。有点像：

JavascriptExecutor js = (JavascriptExecutor) driver;
String script = "return document.getElementById('example');";
WebElement exampleDiv = (WebElement) js.executeScript(script);
exampleDiv.getText();

关于你的问题我也找到了解释here

希望现在更清楚一点）

【讨论】：

【解决方案2】：

这里对 Selenium 中的一些 DOM 命令有一个很好的概述：

http://www.simple-talk.com/dotnet/.net-framework/xpath,-css,-dom-and-selenium-the-rosetta-stone/

它也谈论了很多关于其他选择器的内容，但与其他选择器相比，它可能有助于查看命令的外观。它也提供了一个基本上 eugene 上面谈到的 PDF 文件。

【讨论】：