javascript Chrome/Firefox 中双元符号选择器查询功能的来源是什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8981211/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is the source of the double-dollar sign selector query function in Chrome/Firefox?
提问by minikomi
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:
检查这个 jsfiddle，看看控制台。$$没有定义。现在，打开一个全新的窗口，并进入$$控制台。它定义了一个函数，用于获取与选择器匹配的所有 dom 元素的（类似 jquery 的）数组：
> $$
> $$
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?
这是由开发工具添加的吗？在 Firefox 中使用 Firebug 时也会出现它。它是由工具本身在内部使用吗？
采纳答案by ziesemer
Well, Firebug Litedefines this as:
好吧，Firebug Lite将其定义为：
this.$$=function(selector,doc){if(doc||!FBL.Firebug.chrome){return FBL.Firebug.Selector(selector,doc)
（见来源。）
The full version of Firebug definesthis as
Firebug 的完整版将其定义为
this.$$ = function(selector)
{
return FBL.getElementsBySelector(baseWindow.document, selector);
};
This is actually documentedand yes, it is used internally as well.
这实际上是记录在案的，是的，它也在内部使用。
So I assume that Google Chrome is doing something similar.
所以我假设谷歌浏览器正在做类似的事情。
回答by Paul Irish
Firstly, everything in ziesemer's answer is correct.
首先，ziesemer 的答案中的所有内容都是正确的。
This is all about JavaScript history
这都是关于 JavaScript 的历史
There are a number of functions that are available in various browser's devtools consoles. Collectively, the methods are known as the Command Line API(off-line) (new link) and they all originate from Firebug. Nowadays we just have parity across browsers because Firebug did things (mostly) right.
在各种浏览器的 devtools 控制台中有许多可用的功能。这些方法统称为命令行 API（离线）（新链接），它们都源自 Firebug。现在，我们在浏览器之间只有奇偶校验，因为 Firebug 做的事情（大部分）是正确的。
But back when Firebug was being created (2006), the JavaScript library that was all the rage was Prototype.js. $was grabbed by Prototype for some getElementById()syntactic sugar as that was certainly the quickest way to be grabbing elements and most common element acquisition technique at the time. It was such a timesaver, folks used the whole library just for the $ sugar.
但是在创建 Firebug 时（2006 年），风靡一时的 JavaScript 库是 Prototype.js。$被 Prototype 抓取了一些getElementById()语法糖，因为这当然是抓取元素的最快方式，也是当时最常见的元素获取技术。这太节省时间了，人们使用整个库只是为了 $ Sugar。
In early 2006, jQuery then debuted and used $()for selecting any element based on css selector. As my old CSS Selector Engine Timeline postshows, Prototype then followed up four days laterwith their own, but as $was already taken in their library they just went to $$(), which is now known as the bling-bling function.
2006 年初，jQuery 首次亮相，用于$()基于 css 选择器选择任何元素。正如我的旧CSS Selector Engine Timeline 帖子所示，Prototype 在四天后跟进了他们自己的，但正如$他们刚刚访问的库中已经采用的那样$$()，现在称为bling-bling 函数。
So Firebug was leveraging Prototype's API as it was still ruling the roost in 2006. Now, in the days of jQuery and post-jQuery aliasing like window.$ = document.querySelectorAll.bind(document), we see it as quite backwards. Interestingly, when Opera revolutionized Dragonfly, their browser dev tools, they chose $as their querySelectorAllalias, to better match present day practices, which IMO makes a bit more sense.
所以 Firebug 正在利用 Prototype 的 API，因为它在 2006 年仍然占据主导地位。现在，在 jQuery 和后 jQuery 别名（如 ）的时代window.$ = document.querySelectorAll.bind(document)，我们认为它非常落后。有趣的是，当 Opera 彻底改变他们的浏览器开发工具 Dragonfly 时，他们选择$作为他们的querySelectorAll别名，以更好地匹配当今的实践，IMO 更有意义。
Oh you meant the codesource..
哦，你的意思是代码源..
Now, you asked about the "source" of the $$in DevTools and I explained the history. Whoops! As to why it's available in your console... all of the Command Line API(off-line) (new link) methods are available only within the context of your console, just as convenience methods.
现在，您询问了$$DevTools 中的“来源”，我解释了历史。哎呀！至于为什么它在您的控制台中可用......所有命令行 API（离线）（新链接）方法仅在您的控制台上下文中可用，就像便利方法一样。
- Chrome DevTools'/WebKit Inspector's cmd line API source
- Firebug's cmd line API source
Opera Dragonfly's cmd line API source
- Chrome DevTools'/WebKit Inspector's cmd line API 源
- Firebug 的 cmd 行 API 源码
Opera Dragonfly 的 cmd line API 源码
copy()is one of my favorites; I cover it and others in this JavaScript Console for Power Usersvideo.
copy()是我的最爱之一；我在这个面向高级用户的 JavaScript 控制台视频中介绍了它和其他内容。
