Override default jQuery selector context

Viewed 4899

I'm trying to use jQuery inside a Firefox extension, and actually want to use jQuery to manipulate the DOM of the current page, as opposed to the context of the XUL file. Thus, I load jQuery in my XUL file, and pass it to some of my scripts in a sandbox (using the Greasemonkey extension compiler http://arantius.com/misc/greasemonkey/script-compiler). Since jQuery was not loaded with the page DOM, I want to set its selector context to the page DOM instead of always passing it into jQuery calls.

I followed the solution at How to use jQuery in Firefox Extension and it almost achieves what I want.

jQuery.noConflict();
$ = function(selector,context){ return new jQuery.fn.init(selector,context||example.doc); };
$.fn = $.prototype = jQuery.fn;

I'm able to make calls to the jQuery() function, and the page DOM will be used as the context. However, I can't use functions like jQuery.trim as those are not defined.

I thought this line from the solution

$.fn = $.prototype = jQuery.fn;

will let my own jQuery object inherit all of the jQuery prototype properties, but it apparently doesn't.

Give a vanilla jQuery object, how do I redefine it to use a certain element as the selector context, while preserving all jQuery functions?

3 Answers

Another way of doing it is overriding the constructor:

var initjQuery = jQuery.fn.init;
$.fn.init = function(s,c,r) {
    c = c || window.document;
    return new initjQuery(s,c,r);
};
Related