using xpath to select elements in jQuery?

Question

Is there a plugin to allow me to do this? It says here (XPath Compatibility Plugin) that the functionality was removed back in Jquery version 1.2 and the plugin it links is gone!

Solution

Most browsers support document.evaluate() for selecting elements with XPath expressions - no jQuery required. The only major browser lacking support is Internet Explorer. Dimitri Glazkov has created a library that will implement the missing functionality for IE, however.

var result = document.evaluate("//a[@href='#']", document, null, 0, null),
    item;

while (item = result.iterateNext()) {
    // item will be an <a> element with href="#" here
}

You could easily create a plugin to wrap this functionality too:

(function($) {
    $.xpath = function(exp, ctxt) {
        var item, coll = [],
            result = document.evaluate(exp, ctxt || document, null, 5, null);

        while (item = result.iterateNext())
            coll.push(item);

        return $(coll);
    }
})(jQuery);

// And call it like so:
$.xpath("//a[@href='#']").click(function () { return false; });

Comments

[Michael]

a better solution is shown here stackoverflow.com/questions/2068272/… where you can just use the string as a native css selector

[Andy E]

@Michael: that question and solution are unrelated to this one. This one asks how you can select elements using XPath syntax, that one asks how you can create a CSS selector for an already selected element. You can't really say either is better than the other because they both approach different problems.