最可靠方式是用document.querySelectorAll('link[rel="stylesheet"]')筛选后按href模糊匹配目标CSS文件，注意处理协议、斜杠、参数等URL差异，避免依赖document.styleSheets。
怎么用JS找到页面里某个CSS文件对应的<link>节点
关键不是“找所有<link>”，而是精准定位目标样式表。最可靠的方式是靠href属性匹配——尤其是你明确知道要卸载的CSS路径时。
常见错误：用document.styleSheets遍历，结果发现动态插入的<link>可能没进这个集合（比如设置了disabled=true或跨域），或者styleSheet.href为null（内联
- 优先查
document.querySelectorAll('link[rel="stylesheet"]')，再过滤node.href - 注意路径是否带协议、斜杠结尾、查询参数——
href值是完整URL，建议用includes()或正则模糊匹配，别用全等 - 如果CSS是通过
import或@layer引入的模块化样式，JS无法直接控制，这类不属于<link>节点
移除<link>后样式真的立即失效吗
移除节点本身很快，但浏览器重绘和样式计算有延迟；更重要的是：移除≠回滚已应用的样式规则。
典型场景：A.css定义了.btn { color: red }，B.css后来覆盖成color: blue。此时卸载B.css，按钮颜色不会自动变回red——因为A.css还在，且规则依然有效；但如果A.css也被卸载，而DOM上还留着style="color: blue"内联样式，那它会继续生效。
立即学习“前端免费学习笔记（深入）”；
- 卸载只影响该
<link>加载的规则，不影响其他来源（<style>、内联、JS设置的element.style） - 如果被卸载的CSS里有
@font-face或@keyframes，对应字体或动画可能仍被缓存并可用，直到页面刷新 - Chrome DevTools 的 Elements 面板里能看到节点被删了，但Computed标签页里仍可能显示旧规则——那是缓存视图，刷新一下就清掉
remove() vs parentNode.removeChild() 有区别吗
没本质区别，但remove()更简洁，且能正确处理文本节点、注释节点等非Element子节点；不过IE完全不支持，如果你还要兼容IE，必须用parentNode.removeChild()。
容易踩的坑是：拿到节点后没检查是否存在就调用remove()，结果报Cannot read property 'remove' of null。
- 务必先判空：
if (linkNode) linkNode.remove() - 不要写
linkNode && linkNode.remove()——短路逻辑没问题，但可读性差，不如显式if - 移除前可加个
linkNode.disabled = true做临时禁用，观察效果，再决定是否真删
动态卸载CSS在现代框架里为什么很少见
不是技术做不到，而是副作用太难控：样式层叠、选择器优先级、伪类状态（比如:hover残留）、CSS-in-JS的实例管理……都让“卸载”变成高风险操作。
Vue/React里更倾向用class切换、CSS Modules作用域隔离、或动态useEffect/onMounted控制<link>的挂载/卸载时机，而不是运行时暴力删节点。
- 服务端渲染（SSR）场景下，卸载客户端插入的CSS可能造成FOUC（闪白）或水合不一致
- 微前端中多个子应用共用一个
document，随意删<link>可能误伤其他应用的样式 - 真正需要“卸载”的情况极少，多数时候是想“按需加载”，那应该从源头控制——比如路由懒加载时才插入对应CSS，离开时再清理
复杂点在于：你得同时管住样式规则、字体、动画、媒体查询生效状态，以及它们对布局、渲染性能的连锁影响。删一行remove()容易，删干净且不出视觉bug，得靠更多上下文判断。
