你可能不知道的一些 Chrome 浏览器使用技巧

1. 使用命令行实现网页截图

第一步   打开控制台，右键“检查”或者快捷键F12

第二步   选中需要截图的节点

第三步   ctr+shift+p 打开命令行， 使用Capture node screenshot 就可以下载你需要的节点截图下来了。

使用Capture full size screenshot 即是截取body节点。

2. console 中的 $

① $0 ：当前在Elements选中html节点的引用

     理所当然，$1是我们上一次选择节点的引用  $2是我们上上次引用节点的引用 ，……，一直到$4  

$1.appendChild($0)

② 在console中，$是 document.querySelector的别名，$$是document.querySelectorAll函数的别名。

③ $_ 上次执行结果的引用

④ $i 在Chrome插件: Console Importer 的帮助下可以快速在console之中引入和把玩一些npm库。 

$i('moment')

3. ctrl+l 或者 console.clear() 清空console里面的内容

4. 下面是从 Leo_wlCnBlogs 博客上的文章截图下来的，用了上面说的 Capture node screenshot  ，觉得很完善，收藏下。

https://wwwblogs/Leo_wl/p/4117446.html

 

Chrome Devtools 高级调试指南（新）推荐

Chrome 调试大全
chrome调试
chrome developer tool 调试技巧
THE WEBKIT INSPECTOR

 

Chrome 调试大全 

摘自：http://www.360doc/content/12/1107/20/7851074_246467307.shtml

（FastStone Capture软件滚动截取）