携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第六天，点击查看活动详情
前言
有时候我们浏览一个壁纸网站的时候，可能我们想把这个页面的图片地址全都扒过来，可能你会下载一个工具，获取通过别的途径来实现。但今天我要告诉你，JavaScript也可以，配合上你的浏览器，几行代码帮你轻松搞定，简直不要太哇塞。
爬取页面的img
比如说有这么一个网站：
你觉得所有图片都不错，你很想把他的所有url都爬取过来。这个你就可以写一段JavaScript：
$$('img').map(el => ({src:el.currentSrc})).filter(img => img.src)
拿到所有src。
当然你也可以加上浏览器内置的 copy复制到你的剪切板上。
copy($$('img').map(el => ({src:el.currentSrc})).filter(img => img.src))
注：你可以这么理解，$$类似于jQuery中$
Snippets
当然我们可能只是偶尔会有这样的需求，但是下回想要用的时候，又要重新编写，虽然说不是很难，但是稍微有点麻烦了。而chrome考虑的很周全，他提供了存储代码片段的功能，这样当我们想要用的时候，运行它就可以。
打开devtool-> 切到sources面板 -> 选择导航栏的 Snippets，点击 new snippet，键入后保存，这样就大功告成了。
我们可以右键相应的代码片段名称或者[ctrl] + [enter]快捷键来运行它：
快速运行代码块
还记得我们之前说的 command吗？ 没错，通过command我们可以更快运行你的代码块，当你有多个代码块的时候，效率更为明显。
在devtool界面通过快捷键 [ctrl] + [enter] + [p]打开command窗口，输入 ! 找到想要运行的代码片断回车运行即可。