--- title: Ajuda da Consola da Web slug: Tools/Web_Console/Helpers tags: - Depuração - Desenvolvimento da Web - JavaScript - consola da Web translation_of: Tools/Web_Console/Helpers original_slug: Tools/Consola_da_Web/Ajuda ---
The JavaScript command line provided by the Web Console offers a few built-in helper functions that make certain tasks easier.
$(selector, element)
Looks up a CSS selector string selector
, returning the first node descended from element
that matches. If unspecified, element
defaults to document
. Equivalent to {{ domxref("document.querySelector()") }} or calls the $ function in the page, if it exists.
See the QuerySelector code snippet.
$$(selector, element)
selector
, returning an array of DOM nodes descended from element
that match. If unspecified, element
defaults to document
. This is like for {{ domxref("document.querySelectorAll()") }}, but returns an array instead of a {{ domxref("NodeList") }}.$0
$_
$x(xpath, element, resultType)
xpath
expression in the context of element
and returns an array of matching nodes. If unspecified, element
defaults to document
. The resultType parameter specifies the type of result to return; it can be an XPathResult constant, or a corresponding string: "number"
, "string"
, "bool"
, "node"
, or "nodes"
; if not provided, ANY_TYPE
is used.keys()
Object.keys
.values()
keys()
.clear()
inspect()
pprint()
help()
{{Deprecated_Inline(62)}}:help
{{Gecko_MinVersion_Inline(62)}}cd()
Switch JavaScript evaluation context to a different iframe in the page. This helper accepts multiple different ways of identifying the frame to switch to. You can supply any of the following:
document.querySelector
to locate the iframe elementSee working with iframes.
copy()
outerHTML
is copied. Otherwise, JSON.stringify
will be called on the argument, and the result will be copied to the clipboard.clearHistory()
:screenshot
Screen Shot yyy-mm-dd at hh.mm.ss.png
Comando | Tipo | Descrição |
---|---|---|
--clipboard |
boolean | When present, this parameter will cause the screenshot to be copied to the clipboard. |
--delay |
number | The number of seconds to delay before taking the screenshot. |
--dpr |
number | The device pixel ratio to use when taking the screenshot. |
--file |
boolean | When present, the screenshot will be saved to a file, even if other options (e.g. --clipboard ) are included. |
--filename |
string | The name to use in saving the file. The file should have a ".png" extension. |
--fullpage |
boolean | If included, the full webpage will be saved. With this parameter, even the parts of the webpage which are outside the current bounds of the window will be included in the screenshot. When used, "-fullpage" will be appended to the file name. |
--selector |
string | The CSS query selector for a single element on the page. When supplied, only this element will be included in the screenshot. |
Please refer to the Console API for more information about logging from content.
temp0
, temp1
, temp2
, etc. referencing the node.Let's say you have a DOM node with the ID "title". In fact, this page you're reading right now has one, so you can open up the Web Console and try this right now.
Let's take a look at the contents of that node by using the $()
and inspect()
functions:
inspect($("#title"))
This automatically opens up the object inspector, showing you the contents of the DOM node that matches the CSS selector "#title", which is of course the element with ID "title".
That's well and good if you happen to be sitting at the browser exhibiting some problem, but let's say you're debugging remotely for a user, and need a look at the contents of a node. You can have your user open up the Web Console and dump the contents of the node into the log, then copy and paste it into an email to you, using the pprint()
function:
pprint($("#title"))
This spews out the contents of the node so you can take a look. Of course, this may be more useful with other objects than a DOM node, but you get the idea.