62

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

$
function () { [native code] }

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

我无法找出这个功能是什么。你知道它是做什么的,也许有一些关于这方面的背景信息吗?提前致谢!

4

6 回答 6

50

即使从去年开始,这种情况也再次发生了变化。

devtools 控制台提供$了 的别名document.querySelector,以及许多其他内容;这是一个摘录的列表:

  • $(selector)返回对具有指定 CSS 选择器的第一个 DOM 元素的引用。此函数是该函数的别名document.querySelector()
  • $$(selector)返回与给定 CSS 选择器匹配的元素数组。该命令相当于调用document.querySelectorAll().
  • $_返回最近计算的表达式的值。
  • $0$1和命令用作对在“元素”面板中检查的最后五个 DOM 元素或在“配置文件”面板中选择的最后五个 JavaScript 堆对象的历史引用$2$3$4

……还有一堆其他人。

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

于 2017-11-14T16:42:45.917 回答
28

它是 Chrome 开发人员工具功能之一(因此无法从页面获得)。您可以在控制台页面上查看它的文档

它通过选择器获取元素。

Firefox 实现了类似的东西

于 2012-08-02T13:35:21.233 回答
19

现有答案已过时,$不是document.getElementByIdor的别名document.querySelector,而是querySelector. 这个包装器实际上为要查询其子元素的元素提供了一个可选的第二个参数。

这一系列功能记录在控制台下:选择元素

选择元素

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

$()返回与指定 CSS 选择器匹配的第一个元素。它是document.querySelector().

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

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


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

于 2016-05-15T05:57:01.207 回答
7

开发工具的链接来看,它现在使用 document.querySelector() 而不仅仅是 getElementById()。

于 2013-02-19T22:03:04.360 回答
5

Webkit 检查器中有两个选择器,与 Mootools 一个相同:$$$

你可以在这里找到一些关于它的信息

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

于 2012-08-02T13:35:03.750 回答
5

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

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

于 2012-08-02T13:36:24.443 回答