当然可以，主要有两种实用方式：

• 实时调试与编辑：WebStorm这类主流IDE支持Chrome、Edge等浏览器的远程调试功能。你可以在WebStorm里配置调试项，连接到正在运行的浏览器会话——连接成功后，就能直接在IDE里看到网站的源码，在WebStorm里做的修改还能实时同步到浏览器生效。记得先在浏览器里开启远程调试（比如Chrome启动时添加--remote-debugging-port=9222参数）。
• 先导出再打开：如果只是想把Inspector里的代码存到本地后用WebStorm打开，那你可以先把Inspector里的文件下载到电脑（后面问题会讲具体方法），然后直接把文件夹拖进WebStorm，或者用IDE的「打开」功能加载这些文件就行。

不同浏览器的操作略有区别，下面是主流浏览器的可靠方法：

Chrome/Edge浏览器： #

• 通过Sources面板下载：
  1. 打开Web Inspector（快捷键Ctrl+Shift+I或Cmd+Opt+I），切换到「Sources」标签页。
  2. 在左侧侧边栏展开「Page」栏目，这里能看到网站加载的所有文件（HTML、CSS、JS、图片等）。
  3. 右键点击网站的顶级文件夹（一般是域名命名的），选择「Save all to...」（保存全部到...）。
  4. 选择电脑上的目标文件夹，浏览器就会把所有文件按Inspector里的结构下载到该文件夹中。
• 通过Network面板捕获全资源：
  1. 切换到「Network」标签页，勾选「Preserve log」（保留日志），然后刷新页面以捕获所有加载的资源。
  2. 在请求列表里右键任意位置，选择「Save all as HAR with content」（保存全部为带内容的HAR文件）。
  3. 之后可以用HAR文件解析工具（很多免费工具或IDE插件都支持）把文件提取成可用的文件夹结构。

Firefox浏览器： #

1. 打开Web Inspector，切换到「调试器」标签页。
2. 在左侧侧边栏展开「源」栏目，查看网站的所有文件。
3. 右键点击域名文件夹，选择「保存所有文件」。
4. 选择目标路径，Firefox就会把文件整理成有序的文件夹下载下来。

小提示：要注意，有些动态生成的内容（比如页面加载后通过JS生成的代码），需要先和页面交互触发代码执行，才能被捕获到。另外部分网站有反爬措施，可能无法下载全部资源，这种情况建议先查看网站的服务条款哦。

内容的提问来源于stack exchange，提问作者user11056664