动态插入link节点样式不生效，主因是href路径错误（应使用以/开头的绝对路径）、未设置rel="stylesheet"、节点未挂载到head/body，或未监听load/error事件确保加载完成；切换主题时建议先移除旧link再插入新link。
动态插入link节点时样式不生效？检查href是否为绝对路径
浏览器对相对路径的解析依赖于当前页面URL，不是脚本执行位置。用./style.css或style.css在SPA路由（如/user/profile）下会请求/user/style.css，而非你预期的根目录。
- 始终用以
/开头的绝对路径：/assets/css/theme.css - 避免
import.meta.url拼接——它指向模块文件URL，不是部署根路径 - 构建工具（Vite/Webpack）中，静态资源需放在
public/或通过new URL('./x.css', import.meta.url)生成正确路径（仅适用于ESM环境）
link节点插入后CSS规则未应用？确保节点已挂载且rel=stylesheet
DOM节点必须插入到document.head或document.body才触发加载；漏掉rel="stylesheet"会导致浏览器忽略该链接，甚至静默失败。
- 必须设置
link.rel = 'stylesheet'，不能只靠HTML字符串写死 - 插入前检查
document.head是否存在（SSR或Web Component中可能暂无head） - 不要用
innerHTML注入<link>——部分浏览器不执行其加载逻辑 - 示例正确写法：
const link = document.createElement('link');<br>link.rel = 'stylesheet';<br>link.href = '/theme-dark.css';<br>document.head.appendChild(link);
如何判断动态样式已加载完成？监听load与error事件
样式表加载是异步的，link插入后立即操作DOM可能因规则未就绪而失效。直接读取link.sheet可能为null（尤其跨域CSS或加载失败时）。
- 必须监听
link.onload和link.onerror，而非依赖setTimeout -
link.sheet在加载成功后才可用；错误时sheet仍为null，需靠onerror捕获 - 跨域CSS（如CDN资源）若未配CORS，
sheet始终为null，且onerror不一定触发（取决于浏览器策略） - 避免在
onload里直接调用getComputedStyle——需确保目标元素已渲染，必要时加requestAnimationFrame
多个动态样式切换时，旧link要不要remove？内存与FOUC权衡
不移除旧link节点不会导致样式冲突（后加载的规则自然覆盖），但长期累积会增加DOM节点数、影响性能，且可能引发FOUC（Flash of Unstyled Content）——尤其当新样式加载慢、旧样式被移除后瞬间回退到默认样式。
立即学习“Java免费学习笔记（深入）”；
- 切换主题等明确替换场景：先
remove()旧link，再插入新link - 追加功能样式（如插件CSS）：保留旧节点，仅插入新
link - 移除前检查
link.parentNode是否存在，避免重复remove()报错 - 注意：
link.disabled = true只是禁用规则，不释放资源，也不阻止加载；真正清理必须remove()
href值和network面板里的真实请求地址，比查文档快得多。 
