-
Vue组件中卸载定时器最稳妥方式是用ref存timerID，在onMounted启动、beforeUnmount清除并置空；keep-alive场景需配合onActivated/onDeactivated双保险；推荐封装为自动清理的自定义Hook。
-
Fiddler不拦截WebSocket连接失败的握手请求，需先确认请求是否发出及是否被代理阻断或协议绕过；若看不到CONNECT请求，应检查代理配置、禁用QUIC、开启HTTPSCONNECT捕获并排查端口拦截。
-
WeakMap本身不能实现跨标签页通信，仅限单个执行上下文；它可安全封装本页内跨页通信的私有元数据（如BroadcastChannel实例、监听器映射），依托弱引用实现宿主对象销毁时自动清理，避免内存泄漏和幽灵监听。
-
autocomplete属性值必须为WHATWG规范定义的标准关键词（如email、tel、given-name、street-address）才有效，写错或自定义（如user_name、mobile）会被浏览器直接忽略。
-
带参数的LessMixin必须显式声明默认值，否则未传参时编译报错中断；正确写法为在参数后用冒号设默认值、分号分隔，且所有参数均应设默认值以防编译失败。
-
MediaQueryList接口是媒体查询响应式核心，window.matchMedia()仅是创建其实例的工厂函数；它提供matches属性和addEventListener()方法实现状态监听，需手动检查初始状态且注意语法正确性。
-
JavaScript数组高阶函数如map、filter、reduce等接受函数参数并返回新数组或值，支持不可变性；链式调用通过方法连续执行实现数据流转，如过滤、映射、汇总；实际用于处理用户数据时可清晰表达逻辑，但需注意性能与可读性平衡。
-
CSS变量本身不支持transition，必须将其绑定到color等可动画的原生属性上并对其声明transition，变量更新后原生属性值重算才能触发过渡。
-
浏览器多图上传需设multiple属性和accept="image/*"MIME类型，禁用点号后缀写法；预览优先用URL.createObjectURL()并及时revoke；多组件共存时用class+closest隔离DOM；缩略图布局推荐CSSGrid。
-
CSScontent属性无法响应屏幕尺寸变化，必须配合媒体查询控制伪元素显隐；常见失效原因包括样式覆盖、display/visibility隐藏、空content值及布局塌陷；推荐移动优先写法并注意兼容性与布局抖动问题。
-
需结合HTML、CSS与JavaScript实现搜索框与导航菜单联动：一、监听输入高亮匹配项；二、点击菜单自动填充搜索框；三、搜索触发分组展开；四、用datalist实现自动补全；五、用:focus-within纯CSS展开菜单。
-
:not([class])只匹配HTML中完全未声明class属性的元素，如<p>文本</p>；一旦存在class=""、class=""或class="foo"等任何形式的class属性，即不匹配。
-
Refforwarding是React提供的透传ref机制，使父组件ref能直达子组件内部DOM节点；需用React.forwardRef包裹组件，并将ref显式绑定到目标元素，支持逐层透传与自定义Hook协同。
-
Nginx代理WebSocket升级失败的主因是Upgrade和Connection头未正确配置，而非证书问题；必须设置proxy_http_version1.1、proxy_set_headerUpgrade$http_upgrade、proxy_set_headerConnection"upgrade"，并确保路径、域名、协议严格匹配。
-
最可靠的方式是通过服务器响应头配置X-Frame-Options或Content-Security-Policy；前端JS检测（如top!==self）和meta标签均不可靠，易被绕过或完全失效，且现代浏览器已忽略meta方式。
