jQuery 通过 XPath 选择元素

IT技术 javascript jquery xpath
2021-03-13 08:39:09

我有一个 XPath 选择器。如何使用 jQuery 获取与该选择器匹配的元素?

我看过https://developer.mozilla.org/en/Introduction_to_using_XPath_in_JavaScript但它没有使用 jQuery,而且它似乎有点过于冗长,我想它不是跨浏览器的。

此外,这个http://jsfiddle.net/CJRmk/似乎不起作用。

alert($("//a").length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<a href="a1.php"></a>
<a href="a2.php"></a>

3个回答

如果您正在调试或类似 - 在 chrome 开发人员工具中,您可以简单地使用

$x('/html/.//div[@id="text"]')
@AloisMahdal,它看起来像是 Firebug 的东西(不能 100% 确定它不是 Firefox 的一部分)。Firebug 站点上的文档它也只是document.evaluate()@WladimirPalant 提到的 的简写
2021-04-25 08:39:09
@GregT ... 和 Firefox
2021-04-28 08:39:09
对于 select 和 use 函数,这不起作用:$x('/html/.//div[@id="text"]').hide();必须使用:$($x('/html/.//div[@id="text"]')).hide();
2021-05-11 08:39:09
请注意,这$x()不是 jQuery。它正在返回 HTML DOM。.hide()是一个 jQuery 函数,所以你需要将 HTML DOM 包裹在 a 中$()才能访问 jQuery 函数,就像你使用任何其他原生 JS DOM 函数一样。
2021-05-12 08:39:09
Firefox 开发人员工具也实现了它果然,它是围绕document.evaluate(). 有关帮助程序命令的更多信息
2021-05-13 08:39:09

document.evaluate()Firefox、Chrome、Safari 和 Opera 支持(DOM Level 3 XPath)——唯一缺少的主要浏览器是 MSIE。尽管如此,jQuery 支持基本的 XPath 表达式:http : //docs.jquery.com/DOM/Traversing/Selectors#XPath_Selectors(移动到当前 jQuery 版本的插件中,请参阅https://plugins.jquery.com/xpath/) . 然而,它只是将 XPath 表达式转换为等效的 CSS 选择器。

@Karolis:您说得对,看来此功能已移入插件中。我编辑了我的答案以添加此信息。
2021-04-25 08:39:09
这是用于选择器的旧版 jQuery API
2021-05-09 08:39:09

首先创建一个 xpath 选择器函数。

function _x(STR_XPATH) {
    var xresult = document.evaluate(STR_XPATH, document, null, XPathResult.ANY_TYPE, null);
    var xnodes = [];
    var xres;
    while (xres = xresult.iterateNext()) {
        xnodes.push(xres);
    }

    return xnodes;
}

要在 jquery 中使用 xpath 选择器,您可以这样做:

$(_x('/html/.//div[@id="text"]')).attr('id', 'modified-text');

希望这能有所帮助。

谢谢,我在 Behat/Mink 代码中使用了你的 _x() 函数来修复 find('xpath', 'xpath expression') 在某些情况下的不充分结果。
2021-04-27 08:39:09
我认为如果文档使用命名空间并且在 IE10-11(不支持 XPath)中,这将不起作用。
2021-05-07 08:39:09