-
直接结论:在滚动容器上加overflow-anchor:none能关闭浏览器自动滚动补偿,避免内容插入时视口跳动;但必须配合“触底检测”逻辑,否则用户向上翻页时新消息会把当前阅读位置顶走。
-
漏掉removeEventListener是高频内存泄漏雷区,需检查生命周期配对、避免匿名函数绑定、警惕全局目标监听及removeEventListener参数不匹配等风险。
-
justify-self仅控制单个网格项在其所在单元格内的行内轴对齐,与“最后一行”无关;其生效需满足:元素为网格容器直接子元素,且所在列轨道存在空余空间。
-
通过CSS的transform和transition实现图片悬停平滑放大,首先设置图片默认样式并添加过渡效果,再利用:hover伪类改变scale值,配合overflow:hidden和object-fit:cover优化布局与显示。
-
最轻量兼容的淡入淡出方案是CSSopacity+transition配合JS类名切换:基础类设opacity:0和transition,.show类设opacity:1;多图轮播需JS管理索引、绝对定位叠层、仅用opacity/z-index控制显隐,避免display/visibility导致无法过渡或布局抖动。
-
place-content:center在grid容器上没效果,是因为它只在容器有剩余空间时才生效,需显式设置容器高度且大于网格轨道总高,否则无效。
-
dialog元素默认不渲染,需调用showModal()或show()激活;open属性仅初始化可见但非模态;showModal()启用完整模态链路,show()仅显示浮动层;点击遮罩关闭需兼容Safari坐标判断;method="dialog"表单提交后需手动管理焦点与returnValue兼容性。
-
可用异步生成器配合事件流实现“边触发、边处理、边产出”的异步数组遍历:定义asyncfunction*,每次await事件后yield当前元素,用forawait...of消费;或手动调度next()与Promise;或基于ReadableStream构建带事件依赖的pull机制,注意清理监听器、错误处理与边界控制。
-
configurable是属性最底层的开关,设为false后无法删除属性、不可修改enumerable和configurable本身,仅允许将writable从true改为false;writable可逆需configurable为true,否则固化。
-
子元素填满父容器需父容器设明确高度(如height:100vh)并启用display:flex,子元素设flex:1;height:100%在flex中常失效,应优先用flex分配而非百分比高度。
-
width变化不触发transition需确保元素有明确数值宽度(非auto)、写在默认状态而非hover中、行内元素设为block/inline-block;优先用max-width或flex-basis替代width过渡。
-
必须用:root声明CSS变量,因其语义明确、优先级高且在ShadowDOM和框架组件中更可靠;变量需加前缀如--theme-primary避免冲突;所有颜色引用必须用var(),包括伪元素、表单控件和SVG;动态换肤应使用setProperty()而非cssText;深色模式需用@media直接重写:root,且默认值必须预先声明。
-
SharedWorker是唯一能实现多标签页共用单点WebSocket心跳的机制,其核心是将心跳逻辑完全下沉至独立线程,确保页面失焦或后台时仍持续保活;需在shared-worker.js中实现定时ping、pong响应校验、状态广播、指数退避重连及兼容性降级。
-
V8引擎对展开运算符的快速路径优化,核心是当展开对象为字面量数组、尾部展开或具有稳定隐藏类时,跳过通用迭代直接生成高效机器码;否则回退至开销较大的Symbol.iterator遍历路径。
-
行,但需用fetch()调用PrometheusAPI(如/api/v1/query_range),将返回的秒级时间戳乘1000转毫秒供Chart.js识别,并配置cors_allowed_origins、处理认证与空数据等边界情况。