Web控制台帮助

命令列表

由Web控制台提供的JavaScript命令行工具中包含了一些内置的帮助性函数，它们可以用来简化一些特定任务。

$(selector, element)
使用 selector 值查找一个CSS选择器，返回 element 元素后代中第一个匹配的节点。如果未指定，则 element 默认为 document。相当于 document.querySelector() 或者调用该页面的 $ 函数（在它存在的前提下）。
参考 QuerySelector code snippet。
$$(selector, element)
使用 selector 值查找一个CSS选择器，返回 element 元素后代中所有匹配的节点组成的数组。如果未指定，则 element 默认为 document。它类似于 document.querySelectorAll()，但是返回值是数组，而不是 NodeList。
$0
当前页面中，正在检查的元素。
$_
存储在控制台命令行中执行的上一个表达式的结果。例如，如果输入"2+2"，回车键之后再输入"$_"，按下回车键后控制台将输出4。
$x(xpath, element, resultType)
求出 element 上下文中 XPath（xpath）表达式的值并返回一个包含所有匹配节点的数组。如果未指定，则 element 默认为 document。resultType 参数指定返回结果的类型，它可能是一个 XPathResult constant 类型或者是一个相应的字符串："number"，"string"，"bool"，"node"，"nodes"；如果未提供该参数，则使用 ANY_TYPE。
:block
（从Firefox 80版本开始可用）后跟一个未引用的字符串，阻止URL中包含该字符串的请求。在 Network Monitor 中，该字符串会显示在 Request Blocking sidebar 中并被选中。如果需要取消阻止，就用 :unblock。
cd() 已废弃 Gecko 74
将JavaScript执行上下文切换到该页面上一个不同的iframe框架。该函数接受多种不同方法来确认具体要切换到哪一个框架。
详情请查看 working with iframes。
clear()
清除控制台输出区域。
clearHistory()
就像一个普通的命令行一样，控制台命令行记住你曾经输入的命令（remembers the commands you've typed）。使用该函数来清除控制台的键入命令历史记录。
 copy()
将其中的参数部分复制到剪贴板。如果参数是一个字符串，则复制它的字面内容。如果参数是一个DOM节点，则复制它的 outerHTML 。否则，就针对该参数调用 JSON.stringify 方法，然后将结果复制到剪贴板。
help() 已废弃 Gecko 62
:help
显示帮助文本。事实上，在经过一个令人愉快的递归后，会把你带到这个页面。
inspect()
提供一个对象，为它生成一份 rich output。一旦选择了输出区域中的对象，就可以使用键盘上的箭头按键来浏览对象详情。
keys()
提供一个对象，返回它所有的键（或属性名）。这是 Object.keys 的简写。
pprint() 已废弃 Gecko 74
以一种可读的方式格式化指定值。这在转储对象或者数组内容时非常有用。
:screenshot
使用给定的文件名创建当前页面的屏幕快照。如果没有提供文件名，图片文件将用以下格式命名：
Screen Shot yyy-mm-dd at hh.mm.ss.png
这个命令有如下可选参数：
命令 类型 描述
--clipboard boolean 如果指明，该参数将使屏幕快照复制到剪贴板。
--delay number 在创建屏幕快照之前延迟等待的秒数。
--dpr number 创建屏幕快照时使用的设备像素比率。
--file boolean 如果指明，屏幕快照将保存到文件里，即便其它选项（例如：--clipboard）也存在。
--filename string 用来保存屏幕快照的文件名。这个文件有一个".png"扩展名。
--fullpage boolean 如果指明，整个网页将被保存。有了这个参数，即使是超出了当前窗口边界的页面部分也会包含在屏幕快照里。当使用这一参数时，"-fullpage"字样会被追加到文件名中。
--selector string 指定一个单一元素的CSS选择器。当提供这一参数时，只有这个元素才会被包含在屏幕快照中。
:unblock
（从Firefox 80版本开始可用）后跟一个未引用的字符串，取消阻止URL中包含该字符串的请求。在 Network Monitor 中，该字符串会被从 Request Blocking sidebar 中移除。如果该字符串之前未被阻止，也不会抛出错误信息。
values()
提供一个对象，返回它所有的值。与 keys() 是伙伴函数。

请参照 Console API 获取更多关于该内容的详细信息。

变量

tempN
查看器中的 Use in Console 选项（选中任意一个元素，右键菜单中有该选项）为节点生成了一个变量例如 temp0，temp1，temp2 等等来引用该节点。

示例

查看DOM节点的内容

假如你有一个DOM节点叫做"title"。事实上，你正在阅读的这个页面恰好有一个，所以你可以打开Web控制台，尝试下面的内容。

让我们先来看看调用 $() 和 inspect() 方法之后返回节点的内容：

inspect($("#title"))

这会自动生成该对象的富表示形式（rich output），为你显示匹配CSS选择器 "#title" 的节点内容，当然就是拥有 "title" 的ID的元素啦。你可以使用键盘的上下方向键来浏览输出的内容，右方向键用来展开一个项目，而左方向键是折叠一个项目。

另请参阅