Chrome 中的 $ 变量（美元符号）？答案

【问题标题】：$ Variable (Dollar Sign) in Chrome?Chrome 中的 $ 变量（美元符号）？
【发布时间】：2012-07-31 11:37:21
【问题描述】：

我在没有 jQuery（或任何其他使用 $ 符号作为快捷方式的库）的页面上使用 google chrome 的开发人员工具。当我通过控制台检查$ 时（只需输入并按回车键），我得到了：

$
function () { [native code] }

所以，chrome 有一些可以被$ 引用的原生函数。只有 chrome 似乎有这个，我无法通过 window['$'] 或 document['$'] 或 this['$'] 访问它。

我无法找出这个函数是什么。你知道它是做什么的，也许有一些关于这方面的背景信息吗？提前致谢！

【问题讨论】：

可以在developers.google.com/chrome-developer-tools/docs/console和getfirebug.com/wiki/index.php/Command_Line_API找到信息。
什么 URL 和什么版本的 Chrome？我发现了一个不使用 jQuery 并且没有别名 $ 的页面（这非常困难），但我没有看到 function () { [native code] }。您是否在断点处暂停？
@Matt Ball 你可以直接打开about:blank，打开控制台输入$然后回车。
可能重复：What is the source of the double-dollar sign selector query function in Chrome /Ffirefox?
@tjhorner 感谢您的建议，我在标题中添加了短语“美元符号”。

标签： javascript google-chrome google-chrome-devtools dollar-sign

【解决方案1】：

这种情况再次发生了变化，甚至从去年开始。

devtools 控制台提供$ 作为document.querySelector 的别名，以及many other things；这是一个摘录的列表：

$(selector) 返回对具有指定 CSS 选择器的第一个 DOM 元素的引用。此函数是 document.querySelector() 函数的别名。

$$(selector) 返回与给定 CSS 选择器匹配的元素数组。该命令相当于调用document.querySelectorAll()。

$_ 返回最近计算的表达式的值。

$0、$1、$2、$3 和 $4 命令用作对在“元素”面板中检查的最后五个 DOM 元素或在配置文件面板。

...还有很多其他人。

注意它是如何调用$ 的别名document.querySelector，但说$$ 与调用document.querySelectorAll 是“等价的”。两者似乎都不是真的。 $ === document.querySelector 是false，$$ 返回一个数组，而不是NodeList。

【讨论】：

谢谢！让这个问题保持最新状态将对未来的访问者有用。 :)

【解决方案2】：

它是 Chrome 开发者工具功能之一（因此在页面中不可用）。你可以看到documentation for it on the Console page。

它通过选择器获取一个元素。

Firefox implements something similar

【讨论】：

【解决方案3】：

现有答案已过时，$ 不是document.getElementById 或document.querySelector 的别名，而是querySelector 的包装器。这个包装器实际上需要一个可选的第二个参数来查询元素的子元素。

这一系列函数记录在Console: Selecting Elements：

选择元素

有一些选择元素的快捷方式。与键入标准对应项相比，这些可以为您节省宝贵的时间。

$() 返回匹配指定 CSS 选择器的第一个元素。这是document.querySelector()的快捷方式。

$$() 返回与指定 CSS 选择器匹配的所有元素的数组。这是document.querySelectorAll()的别名

$x() 返回与指定XPath 匹配的元素数组。

但是，这些值只是控制台中的默认值。如果页面通过包含 jQuery 之类的内容覆盖了变量，控制台将使用页面本身的值，而$('p') 之类的内容将返回一个 jQuery 对象，而不仅仅是第一个 p 元素。

【讨论】：

链接已过时，这些功能现在记录在 here。另请注意，$$() 返回 Array，不像 document.querySelectorAll() 返回 NodeList。
而current documentation 将$ 称为document.querySelector 的“别名”（尽管这似乎不是真的；至少$ === document.querySelector 是false）。跨度>

【解决方案4】：

从link to the dev tools 来看，它现在使用 document.querySelector() 而不仅仅是 getElementById()。

【讨论】：

【解决方案5】：

https://developers.google.com/chrome-developer-tools/docs/console

这只是对 document.getElementById 的快速访问。

【讨论】：

我同意，但也要注意 $ == document.getElementById 返回 false ... 奇怪！
@aaaidan，这是因为它只是没有通过 id 获取元素，它也支持嘶嘶声样式选择器！（虽然不是用复杂的测试）
是的。也许它引用了 document.querySelector，那么呢？

【解决方案6】：

Webkit 检查器中有两个选择器，与 Mootools 相同：$ 和 $$

你可以找到一些关于它的信息，here

他们只是在这里帮助您进行调试。

【讨论】：