jquery按xpath选择元素

Question

我有一个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>

Answer 1

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

$x('/html/.//div[@id="text"]')

Answer 2

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选择器.

Answer 3

首先创建一个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;
}

要将xpath选择器与jquery一起使用,您可以这样做:

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

希望这可以提供帮助.