当我们在网页上看到一个好看的H5页面，或者是相当酷炫的JS动画，一个很自然的想法就是F12，然后下载资源占为己有。
F12是前端开发人员的利器，在Chrome开发者工具中，调试时使用最多的功能有：ELements（元素）、Console（控制台）、Sources（源代码），Network（网络）等。其中，Sources可以找到当前页面使用的所有资源。
如果你要做一个横向轮播图的特效，然后找到的网页如下所示：
它的Sources文件内容：
要保存网站内容，一种做法是直接右键另存为整个网页。虽然有时网页也能正常运行，但不可避免地丢失了网站文件夹结构。
当然，你也可以在Sources中挨个文件地另存为，然后重新建立文件夹结构。但此种做法，只能应对资源量较少的网页，而且操作繁琐。
这里，推荐一个谷歌浏览器插件：Save All Resources。它可以在谷歌网上应用店搜索到。
下载该插件，重新打开资源网页，你会发现chrome调试最后多了一栏ResourcesSaver。
点击Save All Resources就可以一键下载当前网站所有资源。下载内容是一个压缩文件，解压后如图：
网友评论