Question

I am developing a firefox plugin using jQuery. I added a page load listener and loading jQuery javascript file inside that function.

   onPageLoad: function(aEvent) {
        var doc = aEvent.originalTarget; // doc is document that triggered the event
        var win = document.defaultView; // win is the window for the doc

        var jsLoader = Components.classes["@mozilla.org/moz/jssubscript-loader;1"].getService(Components.interfaces.mozIJSSubScriptLoader);
        jsLoader.loadSubScript("chrome://myExt/content/jquery-1.8.0.js");

There is no error in loading the jQuery. But, when I am trying to modify DOM using jQuery or make any DOM searches etc., it fails

if($("#id1").length>0) // length is always 0
// do something

var x  = document.getElementById("id1"); //plain old javascript and it works

I am able to do everything using javascript just fine. But, doing the same with jQuery fails without any error. Any idea what may be going wrong here?

Thanks.

Answer 1

I found the solution for this. jQuery loading is fine and able to do non-DOM related functions without any issues. But, $ is failing to do anything with DOM as the function needs to be modified.

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

Here, “doc”is the document. After making this change, everything fell in place.

@everone, thanks for your comments. I did not see the responses earlier. If not, I would have gladly responded back.

• Sailesh