-
CSStransition无法在sticky元素动态添加类时生效，根本原因是其初始高度为auto，而CSS过渡要求起始和结束值均为可计算的具体数值（如px），本文提供兼容性好、无需重排干扰的纯CSS+JS巧妙解法。
-
JavaScript异常捕获需结合try-catch、Promise处理及全局监听机制，从前端error事件到Node.js进程级异常，构建多层防御体系，提升系统稳定性与可维护性。
-
本文详解如何解决多分类商品页中“切换类别后仍添加首类商品”的典型Bug，核心在于修正querySelector的误用、重构商品索引逻辑，并确保每个按钮精准关联对应商品。
-
本文详解为何直接await自定义AJAX封装函数会失效，核心在于函数未返回Promise；通过修正makeCall返回$.ajax()实例，并统一使用async/await风格，可安全链式调用并避免执行中断。
-
实现响应式侧边栏菜单需通过CSS媒体查询和定位控制显示状态。1.HTML结构包含侧边栏与主内容区；2.移动端默认隐藏侧边栏（left:-250px），hover时滑出；3.屏幕≥768px时，侧边栏固定显示，position设为static；4.可选JS添加汉堡按钮控制显隐，提升交互体验。
-
使用Flexbox布局通过align-items:center实现底部工具栏垂直居中，首先设置容器display:flex、固定定位和明确高度，再利用justify-content控制水平分布，确保子元素在60px高容器内居中排列。
-
异步JavaScript通过回调函数等机制让耗时操作不阻塞主线程；回调是作为参数传入并在特定时机调用的函数，常见错误是误写为callback()而非callback；Node.js习惯(err,data)形式，浏览器事件则无err参数；嵌套回调导致“回调地狱”，现代方案Promise/async-await将其转为链式或同步写法但底层仍依赖回调；事件监听、底层API等场景仍需手动写回调，需注意闭包问题。
-
grid是实现三栏等高最直接方案，因其天然支持子项拉伸对齐最高栏；flex方案需确保父容器高度有效且子项未禁用拉伸；float和inline-block已不推荐。
-
Canvas粒子动画需先用document.getElementById获取canvas元素并调用getContext('2d')，宽高须显式设置width/height属性；粒子对象应含x、y、vx、vy、size、alpha字段，数量控制在100–300；连线逻辑需限制检测半径或采用空间划分避免O(n²)性能问题。
-
答案：WebSocket通过单个TCP连接实现全双工通信，适用于实时场景。客户端用JavaScriptAPI建立连接，服务端使用相应框架监听并处理连接请求。握手成功后，双方可主动收发消息，客户端通过onmessage接收、send发送，服务端监听message事件并回执。为保障稳定性，需监听onerror和onclose事件，常见做法是在关闭时触发自动重连。多用户场景下，服务端维护连接列表，支持广播或定向发送，并结合用户ID与房间机制实现群聊、视频会议等业务扩展。关键在于服务端连接生命周期管理与客户端容错
-
sticky元素未粘住的根本原因是父容器设置了overflow非visible或transform等创建新层叠上下文的属性，需逐层检查并重置为overflow:visible和transform:none。
-
本文介绍如何使用async/await在JavaScript中编写顺序执行的异步循环，确保每个fetch请求严格等待前一个响应完成后再发起，从而保证请求与结果输出的时序一致性。
-
hover放大应使用transform:scale()配合transition实现，transition必须写在常态选择器中，避免重排卡顿；注意transform函数执行顺序、像素对齐及嵌套缩放问题。
-
HTML中保留多个空格的方法有五种：一、用 实体；二、用<pre>标签；三、用CSSwhite-space:pre-wrap；四、用<span>加margin/padding模拟；五、用Unicode空格字符如 或 。
-
用linear-gradient替代空src做图片占位可避免空白闪；推荐45deg细网格渐变配background-size:20px20px；动画用opacity脉冲而非transform；懒加载图片需IntersectionObserver控制动画启停；注意object-fit与背景尺寸错位问题。
