HTML标签加载失败报404的根源是路径解析错误、服务端未暴露资源或协议限制；需通过Network面板确认请求URL，检查base标签影响，并直接访问该URL验证服务端是否返回JS内容而非HTML错误页。
HTML里<script>标签加载失败报404，不是脚本写错了，而是浏览器根本没拿到文件——问题出在路径解析、服务端映射或协议限制上。</script>
检查 <script src> 的实际请求路径
浏览器对 <script src> 的路径解析受当前页面 URL 和 <base> 标签双重影响，很容易算错真实请求地址。
- 打开开发者工具 → Network → 切换到 JS 过滤器，找到红色 404 请求，点开看
Request URL字段，确认它是不是你预期的路径 - 如果当前页是
https://example.com/admin/user/，而你写了<script src="js/app.js">，浏览器会发请求到/admin/user/js/app.js，不是根目录下的/js/app.js - 右键页面中该
<script>标签 → “Copy link address”，粘贴出来看浏览器最终解析出的完整 URL 是否合理 - 若用了
<base href="/app/">，所有相对路径都会以/app/为起点，src="js/app.js"就变成/app/js/app.js—— 检查这个路径在服务器上是否存在
验证静态资源是否被服务端正确暴露
即使路径拼对了，服务端也可能压根不提供该文件：权限拒绝、路由拦截、扩展名未注册、大小写不匹配，都可能让请求落到 404。
- 直接在浏览器地址栏访问那个
Request URL（比如https://example.com/js/app.js），看返回的是 JS 内容还是 HTML 页面（常见于 Tomcat/Nginx 默认错误页） - 如果是 HTML，说明服务器没找到 JS 文件，兜底返回了 404 页面——此时控制台会报
Uncaught SyntaxError: Unexpected token '，本质是“资源缺失 + 错误页冒充 JS” - Linux 服务器严格区分大小写：
/JS/app.js≠/js/app.js；Windows 下可能不报错，部署到生产环境就崩 - Nginx/Apache 要确认
location或Directory配置允许读取该路径，且没被deny all或 rewrite 规则意外拦截
排查 URI 中非法字符导致的路径截断
动态拼接 src 时混入空格、中文、&、= 等未编码字符，浏览器会直接截断 URL，后半段根本不会发出去。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
立即学习“前端免费学习笔记（深入）”；
- 典型写法错误：
<script src="js/data.js?name=张三&id=123">——张三和&都没编码，请求可能只发了js/data.js?name=张三 - Network 面板里看失败请求的
Request URL，如果末尾突兀截断、或出现不完整 % 编码（如%E4后没字节），基本就是编码问题 - 正确做法：对每个查询参数值单独调用
encodeURIComponent()，例如"js/data.js?name=" + encodeURIComponent(name) + "&id=" + encodeURIComponent(id) - 绝对不要对整个 URL 字符串调用
encodeURIComponent()，它会把?和=也编码，导致服务端无法解析
注意 file:// 协议下的特殊限制
双击打开 HTML 文件（即走 file:// 协议）时，浏览器会主动拦截含空格、中文或某些符号的资源路径，直接报 404，连请求都不发。
- 现象：本地双击
index.html正常，但<script src="js/我的脚本.js">报 404；换成js/script.js就行 - 这不是服务端问题，是浏览器安全策略——
file://下没有服务端，所谓“404”其实是浏览器自己拒绝加载 - 解决办法只有一个：启动本地服务器（如
npx serve、python3 -m http.server），用http://localhost:xxxx访问，绕过file://限制 - 构建工具（Vite、Webpack Dev Server）默认走 HTTP，所以开发时没问题，一导出静态文件双击就崩，容易误判
最常被忽略的是 <base> 标签和 file:// 协议这两处——它们不报错、不警告，只静默改变路径计算逻辑或直接拦截请求，得靠 Network 面板里的 Request URL 一眼识破。
