唯一可靠方式是用$("")动态插入head；必须设rel="stylesheet"、type="text/css"、完整同源href、插入head；移除时需防残留样式并兼顾CSP与重排。
直接用 $("<link>") 创建并插入 head 是唯一可靠方式；任何把 CSS 字符串塞进 <style></style> 的做法都会丢掉 @media、@import、缓存和 DevTools 追踪能力。
为什么不能用 $.get() 或 $.ajax() 加载 CSS 文件
它们返回的是纯文本字符串，浏览器根本不会解析为样式规则。哪怕你用 $("<style>").text(data).appendTo("head")</style>，也只是把字符串当普通 HTML 插入——@font-face 可能不注册、@media 完全不生效、HTTP 缓存失效、CDN 缓存无法命中，且在 DevTools 的 Styles 面板里看不到完整规则链。
老项目 jQuery 版本（如 1.12 / 2.1）本身也不提供 $.loadCSS() 这类封装，得自己兜底。
动态插入 <link> 的安全写法
必须满足四个硬性条件，缺一不可：
立即学习“前端免费学习笔记（深入）”；
-
rel必须是"stylesheet"，不能是"preload"或漏写 -
type显式设为"text/css"（IE9+ 兼容需要） -
href必须是完整路径，且同源或服务端已配好Access-Control-Allow-Origin - 必须插入到
$("head")，插到body或任意div里完全无效
推荐加 id 便于查重和后续操作：
$("<link>", {
rel: "stylesheet",
type: "text/css",
href: "/css/dark.css?v=" + Date.now(),
id: "theme-css"
}).appendTo("head");移除时别只靠 .remove()，得兼顾残留样式和加载状态
直接 $("link#theme-css").remove() 能删 DOM 节点，但旧样式规则可能还留在渲染树中，尤其在 Safari 或 IE 下容易残留。更稳妥的做法是：
- 移除前给
body加临时 class（如loading-theme），配合 CSS 强制禁用过渡：body.loading-theme * { transition: none !important; } - 确保新
<link>插入前旧的已.remove()，避免两个皮肤样式同时生效冲突 - 如果原
<link>带integrity或crossorigin，新节点必须一并带上，否则 CSP 会静默拦截 - 移动端 Safari 有时延迟生效，可加
setTimeout(() => { document.body.offsetHeight; }, 16)触发强制重排
真正麻烦的从来不是“怎么插”，而是查重、缓存控制、跨域头、IE 兼容性这四点——漏掉任一个，样式就可能在某台机器上彻底不生效，且无报错、难复现。
