如何使用Javascript计算元素的XPath位置？
假设我有一个带有不同种类标记的大型HTML文件，类似于您现在正在查看的StackOverflow。
现在，假设您单击页面上的一个元素，那么该Javascript函数将如何计算出引用该特定元素的最基本的XPath？
我知道在XPath中有无数种方式来引用该元素，但是我正在寻找一种只看DOM树而不考虑ID，类等的东西。
例：
<html>
<head><title>Fruit</title></head>
<body>
<ol>
<li>Bananas</li>
<li>Apples</li>
<li>Strawberries</li>
</ol>
</body>
</html>
假设您点击“ 苹果” 。Javascript函数将返回以下内容：
/html/body/ol/li[2]
从根本上说，它只是将DOM树一直向上扩展到HTML元素。
只是为了澄清，“单击”事件处理程序不是问题。我可以做的。我只是不确定如何计算元素在DOM树中的位置并将其表示为XPath。
PS任何使用或不使用JQuery库的答案，我们都应感谢。
PPS我对XPath完全陌生，因此在上面的示例中我甚至可能犯了一个错误，但是您会明白的。
问题答案：
Firebug可以做到这一点，它是开源BSD的，因此您可以重复使用它们的实现，而无需任何库。
第三方
这是上面链接源的摘录。以防万一上面的链接会改变。请检查源以从更改和更新或提供的完整功能集中受益。
Xpath.getElementXPath = function(element)
{
if (element && element.id)
return '//*[@id="' + element.id + '"]';
else
return Xpath.getElementTreeXPath(element);
};
上面的代码调用此函数。注意，我添加了一些换行符以避免水平滚动条
Xpath.getElementTreeXPath = function(element)
{
var paths = []; // Use nodeName (instead of localName)
// so namespace prefix is included (if any).
for (; element && element.nodeType == Node.ELEMENT_NODE;
element = element.parentNode)
{
var index = 0;
var hasFollowingSiblings = false;
for (var sibling = element.previousSibling; sibling;
sibling = sibling.previousSibling)
{
// Ignore document type declaration.
if (sibling.nodeType == Node.DOCUMENT_TYPE_NODE)
continue;
if (sibling.nodeName == element.nodeName)
++index;
}
for (var sibling = element.nextSibling;
sibling && !hasFollowingSiblings;
sibling = sibling.nextSibling)
{
if (sibling.nodeName == element.nodeName)
hasFollowingSiblings = true;
}
var tagName = (element.prefix ? element.prefix + ":" : "")
+ element.localName;
var pathIndex = (index || hasFollowingSiblings ? "["
+ (index + 1) + "]" : "");
paths.splice(0, 0, tagName + pathIndex);
}
return paths.length ? "/" + paths.join("/") : null;
};
-
本文向大家介绍JavaScript中计算网页中某个元素的位置，包括了JavaScript中计算网页中某个元素的位置的使用技巧和注意事项，需要的朋友参考一下 由于项目的需要，测试中需要对网页元素进行截图，以确保它看上去没有问题。之前我写过一篇文章介绍过一种方法，先使用 WebDriver 进行全屏截图，然后根据目标元素（DOM Element）所在的位置，再对截下来的图片进行剪裁，保留我们需要的位置
-
问题内容： 我正在通过XML数据生成pdf文件。 我将段落元素的高度计算为： 但是这种方法不能正常工作。 你能给我个主意吗？ 问题答案： 您的问题很奇怪。根据您的问题的标题，您想知道字符串的高度，但是您的代码显示您要求的是字符串的宽度。 请看一下FoobarFilmFestival示例。 如果是实例，则可以使用： 当我们使用12号字体时，这将返回基线以上的高度和基线以下的高度。您可能知道，字体大小
-
下面是selenium找不到元素的代码。 但不知何故，它失败了，对我不起作用。它总是给我以下例外情况：过时的元素引用：元素未附加到页面文档 添加了--GetElementStextList的代码 感谢任何帮助。谢谢
-
嗨，我是一个相当新的硒。可以有人请建议如何定位和元素在iframe asi是得到错误下面。 带有Iframe标记的DOM按钮元素的屏幕截图 以前编写的代码
-
问题内容： 我有一个GWT应用程序，正在尝试使用Selenium编写一些测试。 我正在使用XPath来标识测试页面上的元素。使用将无效，因为这些值是由GWT自动生成的，并且可以更改。当我意识到我可以按其标签找到按钮时，事情进展顺利，如下所示： 但是，当我开始运行多个测试时，我开始遇到问题。我意识到问题是，一旦Javascript生成的GWT应用程序的所有不同“页面”都保留在HTML中的隐藏元素中。