或许你我素不相识,但很有可能相逢恨晚,我就是前面胖头鱼

或许你我素不相识，但很有可能相逢恨晚，我就是前面胖头鱼

序言

chrome电脑浏览器做为前面朋友的媳妇，我相信你一定不陌生。调网页页面、写BUG、画款式、看php片减少了它整个世界没劲了。

不相信？一起来看看我们自己的媳妇多厉害....

1#. 一键重新进行要求

在和后端接口联动或清查网上BUG时，你是否也经常会听到她们说这句话：再进行一次要求试一下，我这里看看为什么出错了！

再发要求，我家里有一种简到咋舌的形式。

1. 选定Network
2. 点一下Fetch/XHR
3. 选择要重新发送请求
4. 鼠标右键挑选Replay XHR

无需刷新页面，无需走页面交互，是否特别爽！！！

2#. 在控制面板迅速进行要求

或是联动或修BUG的画面，对于相同的要求，有时候需要改动入参再次进行，有什么快捷方式图标？

1. 选定Network
2. 点一下Fetch/XHR
3. 挑选Copy as fetch
4. 控制面板黏贴编码
5. 改动主要参数，回车键解决

曾经我一直根据改代码或是笔写fetch的形式解决，想一想真的是太傻了...

3#. 拷贝JavaScript自变量

如果你的编码通过测算会伤害一个繁杂的对象，而且需要被拷贝出来发给别人，该怎么办？

1. 应用copy函数公式，将目标做为入参实行就可以

之前我总根据JSON.stringify(fetfishObj, null, 2)打印出到控制面板，再手动式拷贝，这高效率真的是太太低了...

4#. 控制面板获得Elements面板挑中原素

调节网页页面时通过Elements控制面板选定原素后，如果要根据JS了解它一些特性，如宽、高、部位等该怎么办呢？

1. 根据Elements选择要调节元素
2. 控制面板直接使用$0浏览

5#. 提取一张全屏幕的网页页面

有时候我们也会有一些对网页截屏的需要，一屏还行，系统软件带有的截图或是微信聊天截图等可以办得到，可是规定将超过一屏内容也截出来咋办呢？

1. 备好必须截图内容
2. cmd shift p 实行Command指令
3. 键入Capture full size screenshot 按住回车键

如果想提取挑中一部分原素呢？

回答很简单，第三步键入Capture node screenshot就可以

6#. 一键进行全部DOM原素

调节原素时，在等级较深的前提下，你是否也经常会一个个进行去调节？有一种更为便捷的方法

1. 按着opt键 click（必须进行的外层原素）

7#. 控制面板引入上一次实施的结论

一起来看看这样的场景，我想那你也一定经历过, 对某一字符串数组展开了各种各样工艺流程，最后我们想要知道每一步实施的结论，该怎么办？。

'fatfish'.split('').reverse().join('') // hsiftaf

你也许会这么做

// 第1步
'fatfish'.split('') // ['f', 'a', 't', 'f', 'i', 's', 'h']
// 第2步
['f', 'a', 't', 'f', 'i', 's', 'h'].reverse() // ['h', 's', 'i', 'f', 't', 'a', 'f']
// 第3步
['h', 's', 'i', 'f', 't', 'a', 'f'].join('') // hsiftaf

更简单的方式

应用$_引入上一次实际操作得到的结果，无需总是拷贝一遍

// 第1步
'fatfish'.split('') // ['f', 'a', 't', 'f', 'i', 's', 'h']
// 第2步
$_.reverse() // ['h', 's', 'i', 'f', 't', 'a', 'f']
// 第3步
$_.join('') // hsiftaf

8.# 快速切换主题风格

许多学生喜爱chrome的白色主题，有的人喜欢灰黑色，我们可以使用键盘快捷键快速转换2个主题风格。

2. cmd shift p 实行Command指令
3. 键入Switch to dark theme或是Switch to light theme开展主题风格转换

9.# "$"和"$$"选择符

在控制面板应用document.querySelector和document.querySelectorAll挑选当前页元素是比较常见的要求了，但是确实有点儿太长，我们可以用$和$$取代。

10.# $i直接从控制面板组装npm包

你经历过这样的场景吗？有时候想应用例如dayjs或是lodash某个API，但又不愿意去官网查询，假如能在控制面板立即试出来就行了。

Console Importer 就是这么一个软件，用于在控制面板立即组装npm包。

1. 组装Console Importer软件
2. $i('name')组装npm包

11.# Add conditional breakpoint标准中断点的用途

假定有下边这一段编码，我们期待食物名字是