收集一个html文件中用到的所有js css和img资源

【问题标题】：collect all the js css and img resources used in a html file收集一个html文件中用到的所有js css和img资源
【发布时间】：2016-08-02 11:11:28
【问题描述】：

我想写一个 npm 包来本地化一个 html url。
1.使用html url下载html页面
2.解析html文件，提取html中用到的所有js、css和img文件，并将这些资源本地化。
3.如果这些js、css和img文件使用了一些外部资源，本地化这些资源。例如，在 css 中提取背景图像。

第一个和第二个要求很容易满足。但我不知道最后一个。我可以解析所有的 css 文件并本地化其中使用的资源。但是如何解析 js 文件呢？
例如：如果js将'script src = XXX'标签添加到html dom中，我该如何提取src？

【问题讨论】：

【解决方案1】：

我想我会尝试使用无头浏览器来捕获每个网络调用，而不是尝试解析代码。

我没有亲自使用它，但PhantomJS 似乎符合要求。

它可用于加载网页，然后执行通常在请求中发生的任何脚本/css，并在页面加载后执行内容。

network monitoring features 可能是您想要使用的。

【讨论】：

如果我不解析文件，我可以将源文件外部资源的url更改为新的本地资源的url吗？例如
我不明白，也许你的问题可能包含更多关于你想要达到的目标的背景。对于注入的脚本，在它们实际插入到 DOM 之前，您不能做任何事情。但是你可以听 DOM 来检测新插入的东西：(stackoverflow.com/questions/4780822/…)
哇，我没有看到您在原始问题中确实说过您想在本地使用它们。我的错。