复制变量
如何将
JavaScript变量的值复制到其他地方？
在 Chrome 中，有一个名为 copy 的函数可以帮助你复制变量。该 copy 功能不是由 ECMAScript 定义的，而是由 Chrome 提供的。使用此功能，您可以将 JavaScript 变量的值复制到剪贴板。
表对象数组
假设我们有一个这样的对象数组, 在控制台中不容易查看。如果数组更长且元素更复杂，那么它将变得更加难以理解。
Chrome提供了table函数，可以将一系列对象列表化。可以让对象数组以表格的形式展示出来!
隐藏元素的快捷方式
在调试
CSS样式时，我们通常需要隐藏一个元素。如果选择元素并按H键盘，则可以快速隐藏元素。此操作是将visibility: hidden !important;样式添加到相应的元素。
将DOM元素存储在全局临时变量中
如果要在控制台中快速获取
DOM元素引用，可以执行以下操作:
- 选择 HTML 元素
- 右键点击鼠标
- 点击 Store as a global variable
触发CSS伪类
我们可能为一个元素编写多个伪类，并且为了方便我们测试这些样式，我们可以直接在
元素面板中触发这些样式。
在元素面板中拖放
有时我们想调整页面上某些
DOM元素的位置以测试UI。在元素面板中，您可以拖放任何HTML元素并更改其在页面中的位置
重新发送 XHR 请求
在我们的前端项目中，我们经常需要使用
XHR向后端发出请求以获取数据。如果您想重新发送XHR请求，该怎么办？
对于新手来说，他可能会刷新页面，但这可能很麻烦。实际上，我们可以直接在网络面板中进行调试。
调整网络请求速度
我们测试的时候有时需要限制网速，来看各种情况下的加载感受。
网络面板可以设置网络的通信方式为断网模式或者模拟Fast 3G，Slow 3G等情况。
不使用缓存加载
我们在开发的时候常常会因为缓存问题耽误很多开发的时间，一般来说因为缓存造成的问题还是很难解决的，如果考虑不到缓存那么就会很浪费时间，最后发现是缓存问题那么就是会很烦，如何不使用缓存功能呢? 详细如下
不清空日志
你是否曾为页面提交成功后跳转或刷新页面了,来不及看网络的各个请求而烦恼过？其实
网络面板也提供了不清空日志的选项！
前端本地存储
在
应用面板内我们可以查看到所有的前端数据库存储情况
不加载图片, JavaScript 脚本
命令菜单
命令菜单用于Chrome浏览器，而命令行管理程序用于Linux。 通过命令菜单, 您可以输入一些命令来操作Chrome。
首先, 我们打开 Chrome 开发者工具, 然后使用以下快捷方式打开 命令 菜单:
- windows: CTRL + Shift + P
- macOS: Cmd + Shift + P
或者, 我们可以单击下面的按钮将其打开:
然后，我们可以看到 命令 面板, 在这里我们可以选择各种命令来执行各种强大的功能。
屏幕截图
捕获屏幕的一部分是非常常见的要求，并且我确定您当前的计算机上已经具有非常方便的截图软件。但是，您可以完成以下任务吗？
- 截取网页上所有内容的屏幕快照，包括可视窗口中未出现的所有内容
- 精确捕获DOM元素的内容
这是两个常见的要求, 但是使用操作系统随附的屏幕截图工具很难解决。此时, 我们可以使用命令来帮助我们完成此要求。
截取网页上所有内容的屏幕快照, 对应的命令为 Capture full size screenshot
截取 DOM 元素的内容, 对应的命令为 Capture node screenshot
魔术变量
使用 $_ 在控制台中引用上一次操作的结果
$_它引用先前操作的结果，其值始终等于控制台中上一次操作的结果。
使用 $0 在控制台中引用当前选定的元素
$0它引用元素面板中当前选定的元素。
