javascript $ Chrome 中的变量?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11778477/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 14:18:53  来源:igfitidea点击:

$ Variable in Chrome?

javascriptgoogle-chromegoogle-chrome-devtoolsdollar-sign

提问by Dennis

I was working with the developer tools of google chrome on a page without jQuery (or any other library that uses the $sign as a shortcut). When I inspected $by the console (by just typing it in and hitting enter), i got this:

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

$
function () { [native code] }

So, chrome has some native function that can be referenced by $. Only chrome seems to have this one and i cannot access it via window['$']nor via document['$']or this['$'].

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

I was not able to find out what this function is. Do you know what it does and maybe have some background information on this? Thanks in advance!

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

采纳答案by T.J. Crowder

This has changed yet again, even since just last year.

甚至从去年开始,这种情况又发生了变化。

The devtools console provides $as an alias to document.querySelector, along with many other things; here's an excerpted list:

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

  • $(selector)returns the reference to the first DOM element with the specified CSS selector. This function is an alias for the document.querySelector()function.
  • $$(selector)returns an array of elements that match the given CSS selector. This command is equivalent to calling document.querySelectorAll().
  • $_returns the value of the most recently evaluated expression.
  • The $0, $1, $2, $3and $4commands work as a historical reference to the last five DOM elements inspected within the Elements panel or the last five JavaScript heap objects selected in the Profiles panel.
  • $(selector)返回对具有指定 CSS 选择器的第一个 DOM 元素的引用。该函数是函数的别名document.querySelector()
  • $$(selector)返回与给定 CSS 选择器匹配的元素数组。此命令等效于调用document.querySelectorAll().
  • $_返回最近计算的表达式的值。
  • $0$1$2$3$4命令的工作作为一个历史参考元素面板或在过去五年的JavaScript堆内检查在分析面板对象中选择的最后五个DOM元素。

...and a bunch of others.

……还有一堆人。

Note how it calls $an alias of document.querySelector, but says $$is "equivalent" to calling document.querySelectorAll. Neither seems to be literally true; $ === document.querySelectoris false, and $$returns an array, not a NodeList.

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

回答by Quentin

It is one of the Chrome Developer Tools functions (so not available from the page). You can see documentation for it on the Console page.

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

It gets an element by a selector.

它通过选择器获取元素。

Firefox implements something similar

Firefox 实现了类似的东西

回答by Alexander O'Mara

The existing answers are outdated, $is not an alias for document.getElementByIdor document.querySelector, but a wrapper for querySelector. This wrapper actually takes an optional second argument for the element to query the child of.

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

This family of functions is documented under the Console: Selecting Elements:

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

Selecting Elements

There are a few shortcuts for selecting elements. These save you valuable time when compared to typing out their standard counterparts.

$()Returns the first element that matches the specified CSS selector. It is a shortcut for document.querySelector().

$$()Returns an array of all the elements that match the specified CSS selector. This is an alias for document.querySelectorAll()

$x()Returns an array of elements that match the specified XPath.

选择元素

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

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

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

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



However, these values are only the default values in the console. If the page overwrites the variable by including something like jQuery, the console will use the value from the page itself, and something like $('p')will return a jQuery object rather than just the first pelement.

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

回答by AlbertEngelB

Judging by the link to the dev toolsit is now uses document.querySelector() rather than just getElementById().

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

回答by oryol

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

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

It's just quick access to document.getElementById.

它只是快速访问 document.getElementById。

回答by zessx

Ther're two selectors in Webkit inspectors, the same that Mootools one : $and $$

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

You can find some informations on it, here

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

They're juste here to help you in debug.

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