最稳的方式是将值挂到全局对象（如window.APP_CONFIG），再在JS文件中读取。HTML中需先定义变量，确保在script标签之前执行，避免加载顺序问题，且无需URL编码或担心缓存、安全风险。
HTML 中的值怎么动态塞进 <script src></script> 的文件名里
不能直接在 HTML 的 src 属性里写 JS 表达式，比如 <script src="app.js?user_id=%7B%7Bid%7D%7D"></script> 这种模板语法在纯 HTML + 原生 JS 环境里不生效。浏览器加载 <script></script> 标签时，src 就是静态字符串，不会执行任何 JS 逻辑。
用 document.write 拼接 script 标签（仅限同步场景）
如果 HTML 里已有确定的值（比如从 DOM 元素、URL 参数或内联 script 变量中拿到），可以用 document.write 动态生成带参数的 <script></script> 标签。但它只在文档解析过程中有效，且会阻塞后续 HTML 解析 —— 所以只能放在 末尾或 开头，且不能用于异步/模块化环境。
- 确保值已就绪：比如
，再用document.querySelector('meta[name="user-id"]').getAttribute('content')拿到 - 拼接时注意 URL 编码：用户 ID 含特殊字符（如
+、/）会导致请求失败，要用encodeURIComponent() - 不要在模块化项目（如用
type="module"）里用，document.write会清空整个文档
var uid = document.querySelector('meta[name="user-id"]').getAttribute('content');
document.write('<script src="main.js?uid='%20+%20encodeURIComponent(uid)%20+%20'"></script>');
更可靠的做法：把值挂到全局对象，JS 文件里读取
这是最通用、无兼容性风险的方式。HTML 里先定义一个全局变量，JS 文件加载后直接访问它。不需要改 src，也不依赖加载时机顺序（只要 script 标签在变量定义之后）。
Node.js 可靠编程技能。避免事件循环阻塞、异步陷阱、ESM 兼容问题和内存泄漏。触发词：Node.js 开发、async/await、流处理、性能优化、安全编码。
- HTML 中定义变量要早于 script 引入：比如把
window.APP_CONFIG = { user_id: '456' };放在<script src="main.js"></script>上方 - JS 文件里统一从
window.APP_CONFIG或self.APP_CONFIG读，避免硬编码或重复获取逻辑 - 如果用构建工具（如 Webpack/Vite），注意别让这个变量被 tree-shaking 掉 —— 可加
/* webpack-mode: "eager" */注释或显式导出
<script>
window.APP_CONFIG = {
user_id: document.getElementById('user-id').value,
env: 'prod'
};
</script><script src="main.js"></script>
URL 参数传值时要注意缓存和代理问题
有人喜欢用 <script src="bundle.js?v=123"></script> 这类带查询参数的方式“强制刷新”，但浏览器对带 query 的资源仍可能缓存，CDN 或反向代理也可能忽略 query 字符串做缓存键。
- Chrome/Firefox 对
foo.js?a=1和foo.js?a=2默认视为不同资源，但某些企业网关会截掉 query 再转发 - 如果值是敏感信息（如 token），绝不能放 query —— 会出现在服务器日志、Referer、中间代理记录里
- 真正需要区分版本，优先用文件内容哈希命名（如
main.a1b2c3.js），而不是靠运行时拼 query
实际用哪种方式，取决于你能不能控制 HTML 输出时机、是否用构建流程、以及那个“值”到底有多动态。最稳的永远是全局变量法，但得记住：变量声明必须在 script 加载之前完成，这点容易被忽略。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
