浏览器加载 CSS/JS 常见四大静默问题：路径错误致 404、脚本执行时机不当、缓存导致旧代码生效、import map 未正确配置或兼容性不足。
link 标签引入 CSS 时路径写错，浏览器不报错但样式不生效
浏览器加载 link 时遇到 404 路径错误，默认静默失败——没提示、没警告，只在开发者工具的 Network 面板里显示 css 请求状态是 404。常见原因是相对路径算错了当前 HTML 文件的位置。
- 用
<link rel="stylesheet" href="style.css">时，style.css必须和 HTML 文件在同一目录；如果 CSS 在css/子目录，得写css/style.css - 避免用
../往上跳太多层，容易在不同部署环境（本地 vs 服务器）下失效；推荐用以站点根目录为起点的绝对路径：/css/style.css - 检查浏览器地址栏 URL：如果访问的是
file:///xxx/index.html，部分浏览器会禁用相对路径加载 CSS/JS（出于安全限制），此时必须起一个本地服务（如npx serve）才能正常测试
script 标签放在 head 里，执行时报 document.getElementById 返回 null
HTML 是从上到下解析的。script 放在 <head> 里，代码运行时 DOM 还没开始解析，自然找不到元素。这不是语法错误，是执行时机问题。
- 最直接的解法：把
<script src="main.js"></script>移到</body>前面 - 如果必须放
<head>，加defer属性：<script src="main.js" defer></script>，它会等 HTML 解析完再执行（且保证顺序） -
async也放<head>，但它不保证执行顺序，适合独立、无依赖的脚本（比如统计代码），别用它加载操作 DOM 的逻辑
CSS 和 JS 文件修改后，页面还是旧效果
这是缓存导致的，浏览器默认复用已缓存的 .css 和 .js，哪怕你本地文件已经改了。
- 开发阶段最快捷的办法：打开开发者工具 → Network → 勾选
Disable cache（刷新时生效） - 上线前，用构建工具自动加哈希后缀，比如把
index.js输出成index.abc123.js，这样 URL 变了，缓存就自然失效 - 临时调试也可手动加查询参数：
style.css?v=2或main.js?t=1715823490，但别提交到生产环境——参数没意义，还可能干扰 CDN 缓存策略
用 import map 加载 ES 模块，但 Chrome 报 Failed to resolve module specifier
import map 是现代浏览器支持的模块映射方案，但它只对 type="module" 的 <script> 生效，且必须放在所有模块脚本之前。
立即学习“前端免费学习笔记（深入）”；
- 确保 HTML 中有：
<script type="importmap">{ "imports": { "lodash": "https://cdn.skypack.dev/lodash@4.17.21" } }</script> - 对应 JS 必须是模块格式：
<script type="module">import _ from 'lodash';</script>；普通<script>无法使用import map - 注意兼容性：
import map在 Safari 16.4+、Chrome 115+ 才稳定支持，老版本或微信内置浏览器基本不认，别在兼容要求高的项目里当主力方案
