javascriptgoogle-chromefirebuggoogle-chrome-devtools

What is the source of the double-dollar sign selector query function in Chrome/Firefox?


Check this jsfiddle, and have a look at the console. $$ is not defined. Now, open a completely new window, and enter $$ into a console. It defines a function for getting a (jquery-like) array of all the dom elements which match the selector:

> $$

bound: function () {
  return document.querySelectorAll.apply(document, arguments)
}

Is this being added by Dev tools? It is also present when using Firebug in Firefox. Is it used internally by the tools themselves?


Solution

  • Well, Firebug Lite defines this as:

    this.$$=function(selector,doc){if(doc||!FBL.Firebug.chrome){return FBL.Firebug.Selector(selector,doc)
    

    (See the source.)

    The full version of Firebug defines this as

    this.$$ = function(selector)
    {
        return FBL.getElementsBySelector(baseWindow.document, selector);
    };
    

    This is actually documented and yes, it is used internally as well.

    So I assume that Google Chrome is doing something similar.