单击元素时 xpath 发生变化答案

【问题标题】：xpath changed when clicking on an element单击元素时 xpath 发生变化
【发布时间】：2019-01-07 10:53:36
【问题描述】：

我正在开发一种自动化测试工具。为了找到元素 xpath，我编写了几乎适用于所有元素的代码。但是相同的代码不适用于少数元素，并发现该元素的父节点为空。我采用了 chrome 的 xpath 助手，并找到了 span 元素的 xpath，如下所示。

/html[@class='ng-scope']/body/div[@id='ui-datepicker-div']/div[@class='ui-datepicker-header ui-widget-header ui- helper-clearfix ui-corner-all']/a[@class='ui-datepicker-prev ui-corner-all ui-state-hover ui-datepicker-prev-hover']/span[@class='ui-图标 ui-icon-circle-triangle-w']

点击同一个元素后，返回不完整的xpath如下

/div[@class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all']/a[@class='ui-datepicker-prev ui-corner-all ui -state-hover ui-datepicker-prev-hover']/span[@class='ui-icon ui-icon-circle-triangle-w xh-highlight']

即使来自 chrome 的 xpath 助手也不会返回完整路径。如何解决此问题或我缺少什么？

我使用的

xpath 助手只是在单击元素后显示路径的变化。实际上，我在单击元素后使用以下来自互联网的代码来获取 xpath。

function(element) {
            var ix = 0;
            var siblings = element.parentNode.childNodes; // getting error parent node is null
            for (var i = 0; i < siblings.length; i++) {
                var sibling = siblings[i];
                if (sibling === element) {
                    return  getPathTo(element.parentNode) + '/' + element.tagName + '[' + (ix + 1) + ']';
                }
                if (sibling.nodeType === 1 && sibling.tagName === element.tagName)
                    ix++;
            }
        }

当我遇到错误时，函数未返回完整的 xpath。是不是上面的代码是

【问题讨论】：

您的问题上下文薄弱。首先显示您的代码，您使用的是哪种技术？其次，点击时会发生什么？即例如添加类或需要执行什么功能。请提供更多详细信息。
嗨，我已经修改了我的问题。希望现在很清楚。

标签： javascript dom

【解决方案1】：

如果您查看您提供的 XPATH 详细信息

点击前：

/html[@class='ng-scope']
    /body
        /div[@id='ui-datepicker-div']
            /div[@class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all']
                /a[@class='ui-datepicker-prev ui-corner-all ui-state-hover ui-datepicker-prev-hover']
                    /span[@class='ui-icon ui-icon-circle-triangle-w']

点击后

/div[@class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all']
                /a[@class='ui-datepicker-prev ui-corner-all ui-state-hover ui-datepicker-prev-hover']
                    /span[@class='ui-icon ui-icon-circle-triangle-w xh-highlight']

点击元素后，只添加了带有 Span 的“xh-highlight”，即该元素被突出显示。

在这里，您可以自定义这个 XPATH，它应该可以完美运行，例如

/div[@class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all']
                    /a[@class='ui-datepicker-prev ui-corner-all ui-state-hover ui-datepicker-prev-hover']
                        /span[contains(@class,'ui-icon ui-icon-circle-triangle-w')]

即在 Span 中使用 'contains()' 方法而不是 '='。

但我建议不要使用 XPath 助手创建自己的 XPath 定位器

【讨论】：

您好，感谢您的回复。我已经修改了问题。我正在使用 javascript 函数来获取 xpath。但是由于父节点为空而得到错误。