-
应避免使用document.execCommand()插入列表,因其在Chrome、Firefox、Safari中行为不一致,且在contenteditable="false"环境下静默失败;推荐手动DOM操作构建ul/ol结构以确保可控性与稳定性。
-
不能直接代理window或全局对象监控非法数据变更,因fetch、XMLHttpRequest等关键API不可写不可配置;应聚焦函数调用入口,在fetch和XMLHttpRequest.prototype.send入口重写并透传上下文,覆盖console方法提取参数与调用栈,用WeakMap关联behaviorId形成行为链,规避代理定时器、defineProperty及Proxy自身等高危操作。
-
Less中url("@{var}/img.png")不生效,因变量需用~"@{var}/img.png"强制插值;路径值须匹配构建工具规则(如Vite用/img,Webpack用../assets/img),且应统一定义于paths.less中导入。
-
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属性,即不匹配。