最标准的方法是将JavaScript代码提取为独立.js文件并通过引入；其次可用ES模块import语法、fetch动态执行内联脚本、iframe跨文档通信或服务端包含等方式实现复用。
如果您希望在当前HTML文件中使用其他HTML文件中定义的JavaScript代码，则需要通过特定方式将外部HTML文件中的脚本逻辑导入或加载到当前页面。以下是实现此目标的多种方法：
一、使用<script></script>标签直接引入外部JS文件
该方法要求将原HTML文件中的JavaScript代码提取为独立的.js文件，再通过<script></script>标签引用。这是最标准、最可靠的方式，适用于所有现代浏览器。
1、打开原始HTML文件，找到<script></script>标签内的JavaScript代码。
2、新建一个纯文本文件，将JavaScript代码全部复制粘贴进去，保存为common.js（或其他合法文件名），确保编码为UTF-8无BOM。
立即学习“Java免费学习笔记（深入）”；
3、在目标HTML文件的或末尾添加：<script src="common.js"></script>。
4、确保common.js与目标HTML文件在同一目录下，或正确填写相对/绝对路径。
二、使用import语法动态加载模块化JS代码
该方法适用于已将JavaScript代码重构为ES模块（ESM）格式的情况，支持跨HTML文件复用导出的函数或变量。
1、在原始HTML所含的JS代码中，将需复用的部分封装为函数，并使用export导出，例如：export function initWidget() { ... }。
2、将该JS代码保存为utils.mjs（注意扩展名必须为.mjs或在<script type="module"></script>中使用.js）。
3、在目标HTML中添加：<script type="module">import { initWidget } from './utils.mjs'; initWidget();</script>。
4、注意：此方式要求服务器环境运行，不能直接双击打开HTML文件，否则会触发跨域限制。
三、通过fetch加载HTML片段并执行内联脚本
当无法修改原始HTML结构，且必须从另一个HTML文件中提取并运行其内部<script></script>标签内容时，可采用异步获取HTML内容并注入执行的方式。
1、使用fetch('./other.html')请求目标HTML文件内容。
Node.js 可靠编程技能。避免事件循环阻塞、异步陷阱、ESM 兼容问题和内存泄漏。触发词：Node.js 开发、async/await、流处理、性能优化、安全编码。
2、解析响应文本，用正则或DOMParser提取所有<script></script>标签的textContent或src属性值。
3、对每个内联脚本，创建新<script></script>元素，设置textContent，并挂载到document.head或document.body。
4、注意：直接执行内联脚本可能绕过CSP策略，且无法访问原始HTML中定义的全局变量作用域。
四、使用<iframe></iframe>嵌入并桥接脚本上下文
该方法将其他HTML文件作为子页面嵌入，再通过window.postMessage和contentWindow进行跨文档脚本通信。
1、在目标HTML中插入：<iframe id="loader-frame" src="other.html" style="display:none"></iframe>。
2、监听iframe的load事件，获取其contentWindow对象。
3、调用iframe.contentWindow.someExportedFunction()（前提是other.html已将函数挂载至window）。
4、注意：两页面必须同源，否则contentWindow访问被浏览器阻止。
五、服务端包含（SSI）或构建时预处理
在服务端环境（如Apache启用SSI、Nginx配合Lua、或使用Vite/Webpack等构建工具）中，可在HTML编译阶段将其他HTML文件中的<script></script>块直接插入当前文档。
1、在目标HTML中插入SSI指令：<!--#include file="other.html" -->（需服务器启用SSI）。
2、若使用Vite，可借助vite-plugin-html插件，在index.html中通过注入内容。
3、构建后生成的HTML将包含原始HTML中所有的脚本逻辑，无需客户端额外加载。
4、注意：此方式不适用于纯静态托管平台（如GitHub Pages默认不支持SSI）。
