打开浏览器控制台，显示敲下 performance.getEntriesByType('resource')，当前的脚你会看到当前页面加载过的网站所有资源列表。但这不是可用“脚本”——真正的脚本列表，得从 document.scripts 拿。显示

对，当前的脚就是网站那个 HTMLCollection。它包含了当前文档里所有 <script> 标签，可用不管是显示内联的还是外链的，同步的当前的脚还是异步的。一行代码就能把它们全揪出来：

Array.from(document.scripts).forEach((s,网站 i) => {  console.log(i, s.src || '[inline]', s.type || 'text/javascript'); });

控制台会刷出一串结果。外链脚本直接显示 URL，可用内联脚本标记为 [inline]。显示有些 type 是当前的脚 module，有些是网站 application/json——后者其实不是可执行脚本，只是数据块，得手动过滤掉。

但 document.scripts 只反映 DOM 里存在的标签。动态注入的呢？比如通过 document.createElement('script') 加进去再 append 到 head 的，只要还在 DOM 里，一样能抓到。真正抓不到的是那些已经被移除的，或者用 eval、new Function 执行的代码——它们没有对应的 script 标签，自然不在列表里。

想看得更全，得靠 Performance API。每个网络请求的脚本资源都会留下记录：

performance.getEntriesByType('resource') .filter(r => r.initiatorType === 'script') .map(r => r.name);

这会列出所有通过 <script src> 加载的 URL，包括那些后来被移除的。但内联脚本依然不在其中——它们不产生网络请求。

两者结合，基本能覆盖 95% 的情况。剩下的 5% 是 Web Worker 里的脚本、Service Worker 注册的脚本、以及通过 import() 动态加载的模块。Worker 的脚本不在主文档的 document.scripts 里，得去 navigator.serviceWorker 或者 Worker 实例里找。动态 import 的模块倒是会在 Performance 里留下 initiatorType: 'script' 的记录，但 URL 可能是 blob 或者 data URI，看着像乱码。

实际调试时，我习惯先跑一遍 document.scripts，看看页面结构里挂了哪些。然后再查 Performance 记录，对比一下有没有“漏网之鱼”。有次排查一个第三方统计脚本，document.scripts 里死活找不到，Performance 里却有一串陌生的 CDN 域名。最后发现是某个库在运行时动态创建了 script 标签，加载完立刻 remove 了。这种就得靠 Performance 才能逮住。

还有个坑：document.scripts 返回的是实时集合。如果你在遍历过程中有脚本动态添加或删除，长度会变。稳妥点，先 Array.from() 转成静态数组再操作。

至于“所有可用的脚本”这个说法，其实有点模糊。“可用”是指当前已加载的，还是指页面能访问到的？如果指后者，那还得算上全局作用域里通过 import 绑定的模块、window 上挂载的函数、以及闭包里藏着的东西——那些根本不在 DOM 里，也不在 Performance 记录里，只能靠调试器断点或者源码搜索。

所以最实用的做法：打开 DevTools 的 Sources 面板，左侧文件树里列出的所有 JS 文件，就是当前页面真正加载并解析过的脚本。这个列表比任何 API 都直观。右键任意文件，选择 “Copy link address”，就能拿到完整 URL。内联脚本会显示为 (index) 或者 VMxxx，点进去能看到具体代码。

Sources 面板不会骗你。它展示的是 V8 实际编译过的脚本。Performance 可能漏掉缓存命中，document.scripts 可能漏掉动态移除，但 Sources 里的文件树是实打实的。唯一的缺点是它不区分“当前页面”和“Worker 线程”——Worker 脚本会单独列在 Threads 区域，得手动切换。

下次有人问你“这页面用了哪些脚本”，别急着翻源码。F12 打开，Sources 面板截个图，比什么解释都清楚。

(责任编辑：综合)